[HTML] HTML에서 텍스트를 강조하는 방법

HTML에서 텍스트를 강조하는 방법

웹 페이지에서 텍스트를 강조하는 것은 정보를 명확하게 전달하고 사용자의 주목을 끌기 위해 중요합니다. HTML에서는 다양한 태그와 스타일을 사용하여 텍스트를 강조할 수 있습니다.

기본적인 강조 태그

<strong> 태그

<strong> 태그는 텍스트를 굵게 만들어 강조합니다. 이 태그는 중요한 텍스트에 주로 사용됩니다.

<p>이 문장에서 <strong>굵은 부분</strong>은 중요합니다.</p>

<em> 태그

<em> 태그는 텍스트를 이탤릭체로 만들어 강조합니다. 이 태그는 간접적으로 중요한 텍스트에 사용됩니다.

<p>이 문장에서 <em>이탤릭체 부분</em>은 강조됩니다.</p>

<mark> 태그

<mark> 태그는 텍스트에 형광펜을 칠한 것처럼 배경색을 넣어 강조합니다.

<p>이 문장에서 <mark>형광펜 칠한 부분</mark>은 눈에 띄게 강조됩니다.</p>

추가적인 강조 태그

<b> 태그와 <i> 태그

<b> 태그는 텍스트를 굵게, <i> 태그는 텍스트를 이탤릭체로 만듭니다. 이 태그들은 스타일을 변경하지만, 의미적인 강조는 하지 않습니다.

<p><b>굵은 텍스트</b>와 <i>이탤릭 텍스트</i></p>

<u> 태그

<u> 태그는 텍스트에 밑줄을 긋습니다. 이 태그는 일반적으로 텍스트에 의미적인 강조를 추가하지 않으므로 주의해서 사용해야 합니다.

<p><u>밑줄이 있는 텍스트</u></p>

<small> 태그

<small> 태그는 텍스트의 크기를 작게 만듭니다. 주로 주석이나 꼬리말에 사용됩니다.

<p>일반 텍스트 <small>작은 텍스트</small></p>

CSS를 이용한 강조

CSS를 사용하면 더 다양한 강조 스타일을 적용할 수 있습니다. 예를 들어, 텍스트 색상, 크기, 배경색 등을 변경할 수 있습니다.

<style>
  .highlight {
    color: red;
    background-color: yellow;
    font-size: 1.5em;
  }
</style>

<p>이 문장에서 <span class="highlight">이 부분</span>은 CSS로 강조되었습니다.</p>

이렇게 HTML과 CSS를 활용하면 웹 페이지에서 텍스트를 다양한 방법으로 강조할 수 있습니다. 강조의 목적과 콘텐츠의 성격에 따라 적절한 방법을 선택하는 것이 중요합니다.