<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 1. 제목태그 -->
<!-- h태그(head) h1 ~ h6 -->
<!-- h1~h6 글씨크기가 다르게 출력됨. -->
<h1>h1태그여윳</h1>
<h2>h2태그여유ㅜ</h2>
<h3>h3</h3>
<h4>h4</h4>
<h5>h5</h5>
<h6>h6태긍여유</h6>
<!-- 2. 본문태그 -->
<!-- p태그(paragraph) : 단락으로 표현 => 한줄 전체 영역 차지 -->
<p>p태그입니다.</p>
<p>p태그입니다.</p>
<p>p태그입니다.</p>
<!-- span태그 : 문장으로 표현 => 입력한 컨텐츠의 양만큼 영역 차지 -->
<span>span태그입니다.</span><br>
<span>span태그입니다.</span>
<span>span태그입니다.</span>
<!-- br태그 : 줄바꿈 태그 -->
<!-- hr태그 : 수평줄 태그 -->
<hr>
<h3>hr태그 속성 사용 실습</h3>
<hr width = "150px" size="140px" color="red">
<hr width = "150px" size="120px" color="orange">
<hr width = "150px" size="100px" color="yellow">
<hr width = "150px" size="80px" color="green">
<hr width = "150px" size="60x" color="blue">
<hr width = "150px" size="40px" color="navy">
<hr width = "150px" size="20px" color="purple">
<!-- hr*숫자 => hr태그 곱한만큼 생성됨 -->
</body>
</html>
output
'Web > HTML_CSS' 카테고리의 다른 글
| [HTML] a태그 (0) | 2023.03.26 |
|---|---|
| [HTML] 이미지태그 (0) | 2023.03.23 |
| [HTML] 리스트태그 (0) | 2023.03.23 |
| [HTML] 글자형태 (0) | 2023.03.23 |
| [HTML] 단축키 (0) | 2023.03.23 |
댓글