줄바꿈 태그를 사용하지 않아도 줄이 바뀌는 태그와 아닌 태그(span)를 배우다.
<!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>
<!-- 제목태그: 웹 문서의 제목을 표현하는 태그 (h1 ~ h6) -->
<h1 align="center">JS특화반-A</h1>
<h2>JS특화반-A</h2>
<h3>JS특화반-A</h3>
<h4>JS특화반-A</h4>
<h5>JS특화반-A</h5>
<h6>JS특화반-A</h6>
<!-- 수평선 태그 <hr> : 영역을 나누는 구분선 -->
<hr width="" size="10" color="sky blue">
<!-- 문단태그<p>: 단락을 나누어주는 태그,
여백을 주고 나눠줌, 한 줄 자리 차지 -->
<!-- <span> 태그: 콘텐츠의 크기만큼의 자리 차지
문장을 나누어 주는 태그, 가로로 붙어서 배치
사용 이유: 태그를 사용해서 특정 요소에만
접근하여 속성값을 주기위해-->
<span> 안녕하세요. 문장입니다.</span>
<span style="color: blue;"> 안녕하세요. 문장입니다.</span>
<span> 안녕하세요. 문장입니다.</span>
<p>
안녕하세요. 문장입니다.
</p>
<p>안녕하세요. 문장입니다.</p>
<p align="center">안녕하세요. 문장입니다.</p>
<p align="right">안녕하세요. 문장입니다.</p>
<!-- 줄바꿈 태그<br>: 줄은 바뀌지만 붙어서 출력-->
안녕하세요. 문장입니다. <br>
안녕하세요. 문장입니다.
</body>
</html>
h1~6 숫자의 크기가 클수록 글자의 크기는 작아진다.<br/>로 외우면 나중에 좋을지도..
'Front-End > HTML' 카테고리의 다른 글
| [HTML] Ex06_테이블.html (0) | 2023.06.10 |
|---|---|
| [HTML] Ex05_앵커태그.html (0) | 2023.06.10 |
| [HTML] Ex04_이미지태그.html (0) | 2023.06.10 |
| [HTML] Ex03_글자태그.html (0) | 2023.06.10 |
| [HTML] Ex01_basic.html (0) | 2023.06.09 |
