
[html] 글자와 상자 (인라인요소, 블록요소)
2022. 3. 1. 17:26
개발이야기/HTML & CSS & SASS
글자와 상자의 개념을 살펴보자. - 요소가 화면에 출력되는 특성, 크게 2가지로 구분. 인라인(inline)요소 : 글자를 만들기 위한 요소들. 블록(block)요소 : 상자(레이아웃)를 만들기 위한 요소들. 1. 인라인 요소 대표적인 인라인요소로는 태그가 있다. 은 본질적으로 아무것도 나타내지 않는, 콘텐츠 영역을 설정하는 용도. 인라인요소는 기본적으로 왼쪽에서 오른쪽으로 수평으로 쌓이는 특성을 가지고 있다. 자세히보면 가운데 띄어쓰기가 있는것을 볼 수 있다. 인라인 요소는 글자 요소이기때문에 코드를 줄바꿈처리하면 하나의 띄어쓰기로 작동된다. 인라인 요소 인라인요소는 가로, 세로사이즈가 자신이 포함하고 있는 콘텐츠 크기만큼 자동으로 줄어든다. 이번엔 인라인요소에 css스타일을 적용해보자. 인라인 요소 ..