[Web/CSS] CSS - 복습3

✏️ 박스 모델 속성

종류	설명
width	박스 모델의 너비를 지정
height	박스 모델의 높이를 지정
box-sizing	박스 모델의 크기를 계산하는 기준을 지정
box-shadow	박스 모델에 그림자 효과를 추가

✏️ 테두리 속성

속성	설명
border-style	상하좌우 4개 방향의 테두리 스타일을 한꺼번에 지정
border-위치-style	상하좌우 중 특정한 위치의 테두리 스타일만 지정
border-width	상하좌우 4개 방향의 테두리 두께 한꺼번에 지정
border-위치-width	상하좌우 중 특정한 위치의 테두리 두께만 지정
border-color	상하좌우 4개 방향의 테두리 색상을 한꺼번에 지정
border-위치-color	상하좌우 중 특정한 위치의 테두리 색상만 지정
border-radius	상하좌우 4개 방향 꼭짓점을 한꺼번에 둥글게 만들어줌
border-위치-radius	상하좌우 중 특정한 위치의 꼭짓점을 둥글게 만들어줌

✏️ 여백 속성

속성	종류
margin	상하좌우 4개 방향의 마진을 한꺼번에 결정
margn-위치	상하좌우 중 특정한 방향의 마진을 결정
padding	상하좌우 4개 방향의 패딩을 한꺼번에 결정
padding-위치	상하좌우 중 특정한 방향의 마진을 결정

✏️ 레이아웃 속성

속성	설명
display	화면에서 요소를 배치할 방법을 지정. 자주 사용하는 주요 속성으로 block, inline, inline-block, none 등이 있음
float	웹 요소를 왼쪽이나 오른쪽으로 배치. float를 적용한 요소는 clear속성으로 해제할 수 있고 해제하지 않으면 뒤에 오는 요소도 속성을 물려받음

✏️ 위치 지정 속성

종류	설명
left, bottom, right, top	기준 위치와 요소 사이에 상하좌우 얼마나 떨어져 있는지 지정
position	웹 요소의 위치를 지정하고 속성값으로는 fixed, static, relative, absolute가 있음