TIL 60 | CSS inline vs block

song hyun·2022년 6월 5일
0

HTML/CSS

목록 보기
5/5
post-thumbnail

display : inline

  • 대표적으로<span> 태그의 성질은 content, text 크기만큼만 점유하고 동일한 라인에 붙는 성질을 가지고 있다.
  • width, height, line-height 속성 사용불가
  • margin,padding-top,padding-bottom 속성 적용불가

display : inline

  • 대표적으로 <div> 태그의 성질은 한 줄을 전체를 점유하고, 다음 태그는 다음 줄로 넘어간다.

display : inline-bloack

  • display : inline + display : inline = display : inline-bloack
  • 실제로 사실상 display : inline-bloack 은 블록 사이의 디테일한 간격을 컨트롤 할 수 없다.
  • 또한 요즘에는 display : flex를 잘 사용하면 사용할 이유가 없다고 생각한다.
profile
Front-end Developer 🌱

0개의 댓글