inline2 CSS Display CSS Display 속성값들의 특징 1. display: inline; - line break가 일어나지 않습니다. - full width를 차지하지 않습니다. - width, height 속성을 적용할 수 없습니다. 2. display: block; - new line에서 시작합니다. 즉, line break가 일어납니다. - full width를 차지합니다. - width, height 속성이 적용 가능합니다. 3. display: inline-block; - inline과 비슷한 특성이지만 width, height 적용이 가능합니다. - 위와 같은 이유로 line break 시키고 싶진 않으나 width나 height등의 속성의 성격은 box를 따라가고 싶을 때 사용합니다. - 주로 inline .. 2023. 5. 9. CSS Box Model CSS Box Model CSS의 모든 것들은 Box(박스)로 이루어져 있고 이를 이해해야 복잡한 레이아웃을 구성할 수 있습니다. 박스는 크게 Block 박스와 Inline 박스 두 종류로 나뉩니다. 이는 해당 박스가 다른 박스와 어떤 관계고 페이지 흐름 속에서 어떠한 특성을 갖는가로 구분합니다. 그리고 Block 박스와 Inline 박스 안에서도 각각 inner display type 과 outer display type 으로 종류를 나눌 수 있습니다. 1. Box의 구분과 그 특징 1-1. Block + outer display type - 요소를 생성하면 line break과 함께 박스가 생성됩니다. - 이 박스에는 width, height 속성을 적용할 수 있습니다. - padding, borde.. 2023. 5. 9. 이전 1 다음
