고급 - 엘레멘트 영역의 너비(width)와 높이(height)

 

엘레멘트의 콘텐츠 영역은 너비와 높이로 이루어져있다. 블럭레벨 엘레멘트를 기준으로 콘텐츠의 너비(width) 속성은 텍스트나 이미지를 가리지 않고 정확하게 지켜진다. 하지만 높이(height) 속성은 텍스트의 경우 지정한 높이는 기본적인 영역으로 차지하고 있고, 콘텐츠가 지정한 높이보다 내용이 많은 경우 높이 값을 무시하고 높이를 계속 증가시킨다. 하지만 이미지의 경우에는 지정한 높이에 해당하는 영역만 출력된다.

 

하지만 인라인레벨 엘레멘트는 텍스트의 경우도 너비 속성을 무시하는데, 인라인레벨 엘레멘트는 콘텐츠가 차지하는 부분만 너비로 인정된다.

 

[참고] w3schools