자주 사용하는 텍스트 태그1에 대해 알아보려고 한다.
1. 자주 사용하는 텍스트 태그
태그 | 설명 |
<h1>~<h6> | 콘텐츠 내부의 제목 정의 / h1요소는 한 문서에 한번만 지정하는 것을 권장 / 블록 요소 |
<p> | 텍스트의 문단 요소 / 블록 요소이긴하나 특이하게 또다른 블록 요소를 포함하지 않음 |
<br> | 줄바꿈 / 빈 요소로 종료 태그 없음 / 인위적인 여백 값을 만들기 위해 사용 하지 않음! |
<strong> | 강한 강조 / 볼드체로 |
<em> | 일반적인 강조의 의미 / 이탤릭체로 표시 |
<address> | 서명, 작성자 주소 및 연락처 등의 정보 / 블록 요소 |
<mark> | 참조용 표시 정의로, 중요성과 강조를 고려하지 않는 단순 표시사항으로 사용 / 인라인 요소 |
이렇게 주로 사용하는 HTML 태그는 한정되어 있음 , 특히 HTML 태그는 모든 것이 웹에 공개되어 있어 필요한 태그가 있다면 검색을 통해 얼마든지 찾아볼 수 있음
https://www.w3schools.com/html
2. 텍스트 태그 예제1
<! doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title> 제목 태그 h1 <title>
</head>
<body>
<h1> h1 문서의 메인 제목. 한 문서에 한 번만 지정하는 것을 권장 </h1>
<h2> h2~h6 제목 태그로 한 문서 안에 여러 번 사용 가능 </h2>
<h2> h2~h6제목 태그로 한 문서 안에 여러 번 사용 가능 </h2>
<!--<h3> h3제목 태그 </h3>-->
<h4> h4제목 태그 </h4>
<h5> h5제목 태그 </h5>
<h6> h6제목 태그 </h6>
</body>
</html>
3. 텍스트 태그 예제 2
<! doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title> 문단 태그 </title>
</head>
<body>
<h1> 문단 태그 p </h1>
<h3> 텍스트의 문단을 정의하는 요소 </h3>
<p> 단락은 하나 이상의 문장으로 구성되며 이야기의 독립적인 단위를 형성한다. 단락의 시작은 새로운 줄로 나타 </p>
예컨대 책에는 장(chapter)이 있다. 장에는 부 제목이 있다. <br>
그리고 각 제목 아래에는 여러 단락이 있다. </p>
</body>
4. 텍스트 태그 예제 3
<! doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title> 줄 바꿈 태그 </title>
</head>
<h1> 줄 바꿈 태그 br </h1>
<p> 잠언과 <br> 비유와 지혜 있는 자의 말과 <br>그 오묘한 말을 깨달으리라. </p>
<p> 내 아들아 네 아비의 훈계를 들으며 네 어미의 법을 떠나지 말라. </p>
</body>
</html>
5. 텍스트 태그 예제 4
<! doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title> 강한 강조 태그 strong </title>
</head>
<body>
<h1> 강한 강조 태그 strong </h1>
<h3> 인라인 요소 <br> 강한 강조 </h3>
<p><strong> 잠언:</strong> 다윗의 아들 이스라엘 왕 솔로몬의 잠언이라. <br>
이는 지혜와 훈계를 알게 하며 명철의 말씀을 깨닫게 하며 <strong> 지혜롭게, 공의롭게, 정의롭게, 정직하게 </strong> 행할 일에 대하여 훈계를 받게 하며 </p>
</body>
</html>
6. 텍스트 태그 예제 5
<! doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title> 일반 강조 태그 em </title>
</head>
<body>
<h1> 일반 강조 태그 em </h1>
<p>
<strong> 일반적인 강조의 의미 </strong><br>
<strong> 인라인 요소 </strong>
</p>
<p>곧 있으면 <em> 수업시간! </em>입니다! </p>
<p><b>곧 </b> 있으면 <i> 수업시간! </i>입니다! </p>
<p><em>곧 </em> 있으면 수업시간!입니다! </p>
</body>
</html>
지혜를 얻은 자와 명철을 얻은 자는 복이 있나니
-잠언 3:13-
'일과공부' 카테고리의 다른 글
[HTML 기초 강의] ⑥ anchor 태그 (0) | 2021.07.30 |
---|---|
[HTML 기초 강의] ⑤HTML문서,구조화태그 (0) | 2021.07.28 |
[HTML 기초 강의] ③ HTML이란? (0) | 2021.07.26 |
[HTML/CSS 기초 강의] ② 비주얼 스튜디오 코드 사용법 (0) | 2021.07.23 |
[HTML/CSS 기초 강의] ① 비주얼 스튜디오 코드(VS Code) 설치하기 (0) | 2021.07.21 |