HTML - Block요소와 inline요소 정리.
- WEB-Lab/HTML5 & CSS3
- 2020. 5. 25.
HTML - 블록 레벨(Block level)요소와 인라인(inline) 요소
(HTML5에서는 완벽하게 사용되는것은 아니지만, css를 사용할때 반드시 알고 넘어가야한다.)
1. 블록 요소
1.DIV, H1, P
2.사용가능한 최대너비를 사용한다.
3. 크기를 지정할 수 있다.
4. (width: 100%, height:0; 로 시작)
5. 수직으로 쌓임
6. margin, padding 위,아래,좌,우 사용가능하다.
7. 레이아웃
2. 인라인 요소
1.SPAN, IMG
2. 필요한 만큼의 너비를 사용한다.
3. 크기를 지정할 수 없다.
4. (width0; height:0;로 시작)
5. 수평으로 쌓임
6. margin,padding 위,아래는 사용할 수 없다.
7. TEXT
※ 줄바꿈있고 없고 차이가생긴다.
---------------------------------------------------------------------
※ 기본적으로
width: auto, height: auto 로 초기값이 설정되어있지만
블록요소와 인라인요소에 실 적용되는것은 다르다.
기본값
div{ display: block;}
h1{ display: block}
p{ display: block}
span{ display: inline}
'WEB-Lab > HTML5 & CSS3' 카테고리의 다른 글
css - 요소의 수평화 3가지 기법 (0) | 2020.05.24 |
---|