반응형
border-radius
-
CSS 기본 (BOX) : BOX 기본구조, Width와 Height, Border, Border-Radius컴퓨터 알아가기/HTML CSS 2021. 3. 18. 19:30
이제는 CSS를 이해하는데 중요한 BOX 모델에 대해 이야기 해 볼려고 합니다. 네이버에서 개발자코드(F12)로 한번 들어가 보죠. 네이버 검색창은 BOX모양으로 되어 있으며 개발자코드에 다음과 같은 그림으로 확인이 가능합니다. 그럼 이러한 구조가 어떻게 되어 있고 어떤 명칭으로 사용되는지 알아보도록 하겠습니다. ▒ BOX 모델의 기본 구조 BOX모델은 다음과 같이 구분되어 있습니다. ▶ Width와 Height 내용(Contents)를 담는 박스형태로 구분된 사이즈는 넓이와 높이를 지정할 수 있습니다. ▶ Padding Padding은 내용영역과 테두리(Border)를 나타내는 영역사이의 공간을 말합니다. ▶ Border Border(테두리)는 내용영역과 Padding을 둘러싼 영역을 말하며 테두리의 ..