[ 웹 ] SEASON2 12주차 1교시 / Week12 Class1: 듣고 있으면 저절로 이해되는, CSS3기본 박스 속성(보더,패딩,마진속성) / don't worry

▶박스속성 대상: 모든 태그 ▶박스 속성 -border속성 1 테두리 모양 2 테두리 두께 4 테두리 색 -border-radius속성: 둥근 모서리 만들기 -padding 속성 여백(상 우 하 좌) 콘텐츠와 테두리 사이의 간격 (내부 여백) padding-top, padding-right, padding-bottom, padding-left -margin 속성 여백(상 우 하 좌) 각각 테그들의 간격 (외부적인 여백 ) marging-top, margin-right, margin-bottom, margin-left -마진 겹침현상 상하로 인접한 박스의 display 속성 값이 "block"인 경우, 마진 겹침 현상이 발생 큰값을 따른다 박스 사이즈(box-sizing) 속성 -content-box:폭(width)과 높이(height)의 범위는 내용 영역에 한정됩니다 패딩(padding)과 보더(border)는 그 폭과 높이에 포함되지 않고, 다른 폭과 높이가 됩니다 content-box는 초기 값으로, 요소의 크기는 width, padding, border로 계산됩니다 -border-box:내용 영역의 폭(width)와 높이(height)는 패딩(Padding)과 보더(Border)를 포함한 범위가 됩니다 #border, #padding, #margin