display:block; 의 기본 성질은 면적을 나타내는 영역으로 표시가 됩니다. 따라서 width, height, border, padding, margin과 같은 box model의 기본 속성을 모두 사용 가능했습니다.
하지만 inline의 경우 선처럼 옆으로 흐르는 듯한 성질을 가지고 있습니다.
inline의 기본 성질
1.width, height, padding-top, margin-bottom 처럼 높이를 나타내는 속성을 사용할 수 없습니다.
p태그의 더미 텍스트안에 대표적인 inline태그인 span 태그를 사용하여 특정 문장을 강조하는 표시를 나타냈습니다.
이때 span태그에 width, height 값을 주더라도
아무런 변화가 없는것을 볼 수 있습니다.
이번엔 padding과 margin의 top, right, left 모두 30px 씩 주도록 했습니다.
padding, margin 둘 다 left,right에는 30px씩 적용된 것을 확인할 수 있지만 padding의 경우 top 30px이 다른 더미 텍스트의 부분을 가려버리는 모습을 볼 수 있습니다.
???