[css] inline, inline-block , block

welcome·2021년 11월 19일

1. inline


  • inline 요소는 전후 줄바꿈 없이 한줄에 다른요소들과 나란히 배치됩니다.
  • span , a, em(강조, 기울임꼴)
  • width 와 height 속성 지정 불가능 (컨텐츠 크기만큼 만 공간 차지)
  • margin, padding 좌우 간격만 지정 가능하다.

css display 속성은 요소들의 어떻게 보여지고 다른요소들과 상호배치되는 지를 결정합니다.

2. block


  • block 요소는 줄바꿈이 들어가 한줄을 혼자서 모두 차지한다
  • div, p(하나의 문단 표기 , block), h1
  • width, height, margin, padding 모두 지정가능

3. inline-block


  • inline과 같이 전후로 줄바꿈없이 한줄에 여러요소 배치가능
  • inline과 차이점은 width, height, margin, padding 지정가능
  • button, input, select(드롭다운?)

출처


DALSEO

0개의 댓글