태그의 구분
- 블록 레벨 요소를 만드는 "블록 태그"
- 자신이 속한 영역의 너비를 모두 차지하여 블록 형성
- 인라인 요소를 만드는 "인라인 태그"
블록 태그
- <h1>, <p> 등
- 개발자 도구에서 커서 가져다 대면 블록 확인 가능
- 위,아래, 양 옆 공간으로 블록이 있음
인라인 태그
- string 태그 ≫ 콘텐츠를 굵게 표시
- em 태그 ≫ 콘텐츠를 기울여 이탤릭체로 표시
- mark 태그 ≫ 콘텐츠에 형광펜 표시
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>텍스트 태그 연습</title>
</head>
<body>
<h1>제목을 표시하는 큰 텍스트!</h1>
<p>문단을 나타내는 작은(?) 텍스트
<strong>굵은 글씨</strong>
<em>기울여진 글씨</em>
<mark>형광펜 글씨</mark>
</p>
</body>
</html>
- <h1>, <p> 태그는 블록 태그로 블록 영역이 있음 (위, 아래, 양 옆 공간 차지)
- <p> 태그 속의 <strong>, <em>, <mark> 태그는 <p> 태그의 블록을 방해하지 않으면서 자신만의 영역만 차지
- 인라인 태그는 블록 태그 안에 존재하기도 함 !