ㄱ. 제목
</head>
<title>
HTML5 + CSS3 Text
</title>
<body>
<h1>제목글자태그1</h1>
<h2>제목글자태그2</h2>
<h3>제목글자태그3</h3>
<h4>제목글자태그4</h4>
<h5>제목글자태그5</h5>
<h6>제목글자태그6</h6>
</body>
</html>
제목글자태그1
제목글자태그2
제목글자태그3
제목글자태그4
제목글자태그5
제목글자태그6
ㄴ. 본문단락
</head>
<title>
HTML TEXT Basic Page
</title>
<body>
<h1>제목 글자</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Obcaecati temporibus, minus maiores, consequatur dolores accusantium rem fugiat delectus magni eos, doloremque consectetur tempora minima laboriosam est nobis laudantium repellendus aliquam?</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Obcaecati temporibus, minus maiores, consequatur dolores accusantium rem fugiat delectus magni eos, doloremque consectetur tempora minima laboriosam est nobis laudantium repellendus aliquam?</p>
</body>
</html>
제목 글자
Lorem ipsum dolor sit amet consectetur adipisicing elit. Obcaecati temporibus, minus maiores, consequatur dolores accusantium rem fugiat delectus magni eos, doloremque consectetur tempora minima laboriosam est nobis laudantium repellendus aliquam?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Obcaecati temporibus, minus maiores, consequatur dolores accusantium rem fugiat delectus magni eos, doloremque consectetur tempora minima laboriosam est nobis laudantium repellendus aliquam?
ㄷ.다양한 글자 모양
</head>
<title>
HTML TEXT Basic Page
</title>
<body>
<h1><b>Lorem ipsum dolor sit amet</b></h1>
<h1><i>Lorem ipsum dolor sit amet</i></h1>
<h1><small>Lorem ipsum dolor sit amet</small></h1>
<h1>Lorem ipsum dolor sit amet</sub></h1>
<h1>Lorem ipsum dolor sit amet</sup></h1>
<h1><ins>Lorem ipsum dolor sit amet</ins></h1>
<h1><del>Lorem ipsum dolor sit amet</del></h1>
</body>
</html>
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
ㄹ.특수문자 (공백,<,>,&)
특수문자 | 출력문자 |
| 공백 |
&It; | < |
> | > |
& | & |
ㅁ.앵커태그
- 다른 웹페이지 or 웹페이지 내부로 이동할 때 사용
- a 누르면 자동완성
ex) 다른 웹페이지로 이동
<a href="https://devjanghwa.tistory.com/">Dev 장화의 블로그</a>
Dev 장화의 블로그
ex) 웹 페이지 내부로 이동
: 내부로 이동할때는 앞에 #을 붙임
</head>
<title>
HTML TEXT Basic Page
</title>
<body>
<a href="#alpha">Alpha로 이동</a>
<a href="#beta">Beta로 이동</a>
<a href="gamma">Gamma로 이동</a>
<hr>
<h1 id="alpha">Alpha</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus ad obcaecati soluta maiores, repudiandae quidem accusamus itaque incidunt perspiciatis, distinctio quaerat eos ipsa doloremque expedita culpa dignissimos sint magni totam.</p>
<h1 id="beta">Beta</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus ad obcaecati soluta maiores, repudiandae quidem accusamus itaque incidunt perspiciatis, distinctio quaerat eos ipsa doloremque expedita culpa dignissimos sint magni totam.</p>
<h1 id="gamma">Gamma</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus ad obcaecati soluta maiores, repudiandae quidem accusamus itaque incidunt perspiciatis, distinctio quaerat eos ipsa doloremque expedita culpa dignissimos sint magni totam.</p>
</body>
</html>
Alpha
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus ad obcaecati soluta maiores, repudiandae quidem accusamus itaque incidunt perspiciatis, distinctio quaerat eos ipsa doloremque expedita culpa dignissimos sint magni totam.
Beta
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus ad obcaecati soluta maiores, repudiandae quidem accusamus itaque incidunt perspiciatis, distinctio quaerat eos ipsa doloremque expedita culpa dignissimos sint magni totam.
Gamma
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus ad obcaecati soluta maiores, repudiandae quidem accusamus itaque incidunt perspiciatis, distinctio quaerat eos ipsa doloremque expedita culpa dignissimos sint magni totam.
'HTML/CSS/JS' 카테고리의 다른 글
[HTML5] 06. div, span, 시맨틱태그 (0) | 2022.10.17 |
---|---|
[HTML5] 05. 입력 양식 태그 (input,label,select,multiple,optgroup) (0) | 2022.10.14 |
[HTML5] 04.미디어 태그 (img,src,audio,video) (0) | 2022.10.13 |
[HTML5] 03.테이블 태그 (table,tr,th,td,colspan,rowspan) (0) | 2022.10.13 |
[HTML5] 02.목록태그 (list,ul,ol,li) (0) | 2022.10.13 |
ㄱ. 제목
</head>
<title>
HTML5 + CSS3 Text
</title>
<body>
<h1>제목글자태그1</h1>
<h2>제목글자태그2</h2>
<h3>제목글자태그3</h3>
<h4>제목글자태그4</h4>
<h5>제목글자태그5</h5>
<h6>제목글자태그6</h6>
</body>
</html>
제목글자태그1
제목글자태그2
제목글자태그3
제목글자태그4
제목글자태그5
제목글자태그6
ㄴ. 본문단락
</head>
<title>
HTML TEXT Basic Page
</title>
<body>
<h1>제목 글자</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Obcaecati temporibus, minus maiores, consequatur dolores accusantium rem fugiat delectus magni eos, doloremque consectetur tempora minima laboriosam est nobis laudantium repellendus aliquam?</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Obcaecati temporibus, minus maiores, consequatur dolores accusantium rem fugiat delectus magni eos, doloremque consectetur tempora minima laboriosam est nobis laudantium repellendus aliquam?</p>
</body>
</html>
제목 글자
Lorem ipsum dolor sit amet consectetur adipisicing elit. Obcaecati temporibus, minus maiores, consequatur dolores accusantium rem fugiat delectus magni eos, doloremque consectetur tempora minima laboriosam est nobis laudantium repellendus aliquam?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Obcaecati temporibus, minus maiores, consequatur dolores accusantium rem fugiat delectus magni eos, doloremque consectetur tempora minima laboriosam est nobis laudantium repellendus aliquam?
ㄷ.다양한 글자 모양
</head>
<title>
HTML TEXT Basic Page
</title>
<body>
<h1><b>Lorem ipsum dolor sit amet</b></h1>
<h1><i>Lorem ipsum dolor sit amet</i></h1>
<h1><small>Lorem ipsum dolor sit amet</small></h1>
<h1>Lorem ipsum dolor sit amet</sub></h1>
<h1>Lorem ipsum dolor sit amet</sup></h1>
<h1><ins>Lorem ipsum dolor sit amet</ins></h1>
<h1><del>Lorem ipsum dolor sit amet</del></h1>
</body>
</html>
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
ㄹ.특수문자 (공백,<,>,&)
특수문자 | 출력문자 |
| 공백 |
&It; | < |
> | > |
& | & |
ㅁ.앵커태그
- 다른 웹페이지 or 웹페이지 내부로 이동할 때 사용
- a 누르면 자동완성
ex) 다른 웹페이지로 이동
<a href="https://devjanghwa.tistory.com/">Dev 장화의 블로그</a>
Dev 장화의 블로그
ex) 웹 페이지 내부로 이동
: 내부로 이동할때는 앞에 #을 붙임
</head>
<title>
HTML TEXT Basic Page
</title>
<body>
<a href="#alpha">Alpha로 이동</a>
<a href="#beta">Beta로 이동</a>
<a href="gamma">Gamma로 이동</a>
<hr>
<h1 id="alpha">Alpha</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus ad obcaecati soluta maiores, repudiandae quidem accusamus itaque incidunt perspiciatis, distinctio quaerat eos ipsa doloremque expedita culpa dignissimos sint magni totam.</p>
<h1 id="beta">Beta</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus ad obcaecati soluta maiores, repudiandae quidem accusamus itaque incidunt perspiciatis, distinctio quaerat eos ipsa doloremque expedita culpa dignissimos sint magni totam.</p>
<h1 id="gamma">Gamma</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus ad obcaecati soluta maiores, repudiandae quidem accusamus itaque incidunt perspiciatis, distinctio quaerat eos ipsa doloremque expedita culpa dignissimos sint magni totam.</p>
</body>
</html>
Alpha
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus ad obcaecati soluta maiores, repudiandae quidem accusamus itaque incidunt perspiciatis, distinctio quaerat eos ipsa doloremque expedita culpa dignissimos sint magni totam.
Beta
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus ad obcaecati soluta maiores, repudiandae quidem accusamus itaque incidunt perspiciatis, distinctio quaerat eos ipsa doloremque expedita culpa dignissimos sint magni totam.
Gamma
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus ad obcaecati soluta maiores, repudiandae quidem accusamus itaque incidunt perspiciatis, distinctio quaerat eos ipsa doloremque expedita culpa dignissimos sint magni totam.
'HTML/CSS/JS' 카테고리의 다른 글
[HTML5] 06. div, span, 시맨틱태그 (0) | 2022.10.17 |
---|---|
[HTML5] 05. 입력 양식 태그 (input,label,select,multiple,optgroup) (0) | 2022.10.14 |
[HTML5] 04.미디어 태그 (img,src,audio,video) (0) | 2022.10.13 |
[HTML5] 03.테이블 태그 (table,tr,th,td,colspan,rowspan) (0) | 2022.10.13 |
[HTML5] 02.목록태그 (list,ul,ol,li) (0) | 2022.10.13 |