정의 및 사용 방법
<mark>
태그는
한 문서 내에서 문맥상 관련성이 있어 참조하거나 관심이 있는 텍스트 구간임을 나타냅니다.
이 구간은 다른 문맥과의 관련성에 따라 돋보기게 할 목적으로 하이라이트 처리됩니다.
대부분의 브라우저에서는 <mark>
태그의 텍스트에 형광펜으로 마크한 것과 같은 하이라이트가 표시됩니다.
기본 예제
<mark>
태그는 한 문서 내에서 관련성이 있는 특정 부분을 참조 목적으로 표시하거나 관심이 있는 텍스트 구간을 표시하기 위해 사용됩니다.
검색 결과에서 검색어 표시
검색 결과를 보여줄 때 사용자가 입력한 검색어를 쉽게 찾아볼 수 있도록 시각적으로 구분해 주는 것이 중요합니다. <mark>
태그는 검색어와 일치하는 텍스트를 참조하고 있다는 것을 나타냅니다.
<p>
<kbd>코딩에브라비디</kbd>에 대한 검색 결과입니다.
</p>
<ul>
<li>
<mark>코딩에브리바디</mark>는 모든 사람을 위한 코딩 학습서입니다.
</li>
<li>
환영합니다. <mark>코딩에브리바디</mark>입니다.
</li>
</ul>
코딩에브라비디에 대한 검색 결과입니다.
- 코딩에브리바디는 모든 사람을 위한 코딩 학습서입니다.
- 환영합니다. 코딩에브리바디입니다.
관심이 있는 부분을 표시
다음은 인용문 내 관련 텍스트 중 관심 있는 부분을 표시하기 위해 <mark>
태그를 사용한 예제입니다.
<blockquote>
<p>"학습은 경험을 통해 이루어지며, <mark>실수</mark>는 중요한 교훈을 제공합니다."</p>
</blockquote>
"학습은 경험을 통해 이루어지며, 실수는 중요한 교훈을 제공합니다."
사용 방법
<mark>
태그는 한 문서 내에서 관련성이 있는 특정 부분을 참조 목적으로 표시하거나 관심이 있는 텍스트 구간을 표시하기 위해 사용됩니다.
이 구간은 다른 문맥에서의 관련성 때문에 하이라이트 처리됩니다.
인용문이나 본문에서 참조된 다른 텍스트 블록 내에서 사용될 때, 이는 원래 존재하지 않았지만 독자의 주의를 해당 텍스트 부분으로 끌어들이기 위해 추가된 하이라이트를 나타냅니다. 이 텍스트 블록이 처음 작성되었을 때 원래의 저작자가 중요하지 않다고 여겼을 수 있는 부분이 현재 예상치 못한 강조를 받게 됩니다. 문서의 본문에서 사용될 때, 이는 사용자의 현재 활동과 관련성 때문에 하이라이트로 처리된 문서의 부분을 나타냅니다.
일반적인 사용
- 인용문(
<q>
,<blockquote>
)에서 사용될 때, 일반적으로 원본 자료에서 특별한 흥미를 끄는 텍스트를 나타내며, 원래 저자가 그것을 특별히 중요하게 생각하지 않았지만 특별한 주의를 필요로 하는 자료를 나타냅니다. 이것은 책에서 관심 있는 부분을 표시하기 위해 형광펜을 사용하는 것과 유사하다고 생각하십시오. - 그렇지 않은 경우,
<mark>
태그는 문서 내용 중 사용자의 현재 활동과 관련이 있을 것으로 예상되는 부분을 나타냅니다. 이것은 예를 들어 검색 작업과 일치하는 단어를 나타내는 데 사용될 수 있습니다. <mark>
태그를 구문의 스타일을 위한 하이라이트 목적으로 사용하지 마세요. 대신, 적절한 CSS를 적용한<span>
를 사용하세요.
<mark>
와 <strong>
태그의 차이점
브라우저 호환성
태그 |
데스크탑 Chrome
|
데스크탑데스크탑 Edge
|
데스크탑 Firefox
|
Safari
|
---|---|---|---|---|
<mark>
|
7 | 12 | 4 | 5.1 |
명세서
명세서 사양 | |
---|---|
<mark>
|
HTML Standard #the-mark-element |