1. 블록 레벨 요소.
- 주요 태그 : div, hn, p
- 사용 가능한 최대 가로 너비를 사용한다.
- 크기를 지정할 수 있음.
- whidth : 100%, height : 0%로 시작 ==> default 값
- 수직으로 쌓인다.
- margin, padding의 속성에 위, 아래, 좌, 우 사용이 가능하다.
- 레이아웃을 설정하는 용도로 사용됨
2. 인라인 레벨 요소.
- 주요 태그 : span, img
- 필요한 만큼만의 너비를 사용한다.
- 크기를 지정할 수 없음.
- whidth : 0%, height : 0%로 시작 ==> default 값
- 수평으로 쌓인다.
- margin, padding의 속성에 위, 아래, 좌, 우 사용이 불가능하다.
- 텍스트를 설정하는 용도로 사용이 된다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<div></div>
<hr>
<span>텍스트</span>
</body>
</html>
span과 div가 차지한 영역 값이 다른 것을 볼 수 있다.
'Front > CSS' 카테고리의 다른 글
[CSS3] margin과 padding (여백) (0) | 2021.04.22 |
---|---|
[CSS3] display 속성 (0) | 2021.04.22 |
[CSS3] em 단위 (0) | 2021.04.22 |
[CSS3] 선택자의 종류(태그, class, id) (0) | 2021.04.20 |
[CSS3] CSS 기본 개념 (0) | 2021.04.20 |