[CSS] box model과 box-sizing
안녕하세요. 이번 포스팅은 css의 Box model 개념에 대해서 알아 보도록 하겠습니다. HTML의 모든 요소(element)들은 사각형의 박스 형태로 표시되는데 이 박스는 margin, padding, border, content로 구성 되며 이것들이 합쳐져 너비(width), 높이(height)를 결정한다. 즉, 박스의 크기를 결정하고 박스 모델을 만들게 됩니다. 위에 보이는 것과 같이 구성 됩니다. 그럼 박스를 구성하는 구성요소에 대해서 하나씩 알아보죠. contentcontent는 말 그대로 실제 내용을 포함하는 영역입니다. 그리고 content는 width, height, min-width, max-width, min-height, max-height 를 가지고 크기를 지정하고 제어 할 수 ..
더보기
[CSS] display - block과 inline 그리고 inline-block
안녕하세요. 오늘은 display porperty에 대해서 알아 보겠습니다. 그 중에서 inline과 block 그리고 inline-block에 대해서 알아보겠습니다. 먼저 display property에서 간단히 설명하면 display는 화면이 렌더링 되었을때 어떠한 특정 영역이 표시 되는데 성질을 부여하는 property입니다. 그 중 가장 많이 사용 되는 inline과 block 성질(display property의 값)입니다. 우선, html의 태그들은 크게 block 요소와 inline 요소로 나눌 수 있다. block 요소, , , , , , , , , , ,, , , , , , , , , , , block 요소들은 위와 같은 요소들이 있으며 위에 나열된 태그들 말고도 많은 태그들이 있습니다...
더보기