Part 2 : 텍스트 태그 사용법

웹페이지에서 제목, 본문, 강조 표시 등을 올바르게 표현하려면 텍스트 태그를 이해해야 합니다.

이번 글에서는 <h1>~<h6>, <p>, <strong>, <em>, <u>, <span> 등의 태그를 살펴보겠습니다.

 

---

 

1️⃣ <h1> ~ <h6> 태그 (제목)

HTML에서 제목을 표시하는 태그로, <h1>이 가장 크고 <h6>이 가장 작습니다.

<h1>가장 중요한 제목</h1>
<h2>두 번째로 중요한 제목</h2>
<h3>조금 더 작은 제목</h3>

 

🔹 제목은 문서의 계층 구조를 표현하는 데 사용됩니다.

 

---

 

2️⃣ <p> 태그 (문단)

본문을 작성할 때 사용되는 태그입니다.

<p>이것은 단락을 나타내는 태그입니다. 문장을 그룹화할 때 사용됩니다.</p>

 

🔹 자동 줄 바꿈이 적용됩니다.

 

---

 

3️⃣ <strong> & <em> 태그 (강조)

텍스트를 강조할 때 사용됩니다.

<p><strong>이 텍스트는 강하게 강조됩니다.</strong></p>
<p><em>이 텍스트는 기울임(이탤릭체)으로 강조됩니다.</em></p>

 

🔹 <strong>은 SEO에도 영향을 줄 수 있는 중요한 강조입니다.

🔹 <em>은 단순한 강조 효과입니다.

 

---

 

4️⃣ <u> 태그 (밑줄)

밑줄을 추가할 때 사용됩니다.

<p><u>이 문장은 밑줄이 적용되었습니다.</u></p>

 

🔹 주의: 시각적 효과만 제공하므로 남용하지 않는 것이 좋습니다.

 

---

 

5️⃣ <span> 태그 (인라인 스타일링)

특정 텍스트에 스타일을 적용할 때 사용됩니다.

<p>이 문장에서 <span style="color: red;">이 부분만 빨간색</span>으로 표시됩니다.</p>

 

🔹 블록 요소가 아니라 인라인 요소이므로 한 줄 안에서 스타일링할 때 유용합니다.

 

---

 

🎯 마무리

이제 HTML의 텍스트 태그를 이해하고, 적절한 태그를 사용할 수 있습니다!

🚀 다음 포스팅에서는 목록 태그에 대해 다뤄보겠습니다. 😊

 

 

 

- Dblisher -