[HTML] Block 요소와 Inline 요소


[HTML] Block 요소와 Inline 요소

Block 요소 - <div>, <h1>, <p> 등 1. 사용 가능한 최대 가로 너비를 사용함. <body> 내에 block 요소인 <div> 생성 <div>에 대한 배경색 지정(좌), 결과 화면(우) - 가로 너비를 지정하지 않았으나 화면의 왼쪽부터 오른쪽 끝까지 배경색이 모두 출력됨. 2. 크기를 지정할 수 있음. <body> 내에 block 요소인 <div> 생성(좌), <div>에 대한 배경색과 width, height 지정(우) 결과 화면 - 지정된 px만큼의 너비와 높이를 가지는 영역이 됨. 3. width: 100%, height: 0px에서 출발 - 이 값에서 출발해서 요소가 완성되는 것. - block 요소가 늘 이 값을 가진다는 건 아니라는 점에 유의. <div>에 height는 지정하지 않고 width값만 지정(좌), 결과 화면(우) - 이전 예와 비교해 height를 지정하지 않으면 <div> 내용의 높이만큼만 영역을 가지게 됨. 4. 수직으로 쌓임. - 블...


#block #element #html #inline

원문링크 : [HTML] Block 요소와 Inline 요소