[CSS] 태그의 크기 block, inline, margin, padding

태그에는 기본적으로 block의 속성이나 inline속성을 갖고있고

margin, padding의 속성을 갖고있다

block

block의 속성을 갖고 있는 대표적인 태그는 div로 한줄을 전부 사용하는 태그이다

block속성을 갖고 있는 태그들은 태그를 닫으면</div> 자동으로 줄바꿈을 해준다

inline

inline의 속성을 갖고 있는 대표적인 태그는 span으로 텍스트 크기만큼을 사용하는 태그이다

inline속성을 갖고 있는 태그들은 태그를 닫아도</span> 줄바꿈이 없이 계속해서 써나갈 수 있다

inline의 태그는 높이(height)나 넓이(width)를 바꿀 수 없다

 

margin

margin은 태그의 안쪽 크기이다

padding

padding은  태그의 바깥쪽의 크기이다

 

예제

 

See the Pen Untitled by korearaogong (@korearaogong) on CodePen.