• Skip to main content
  • Skip to search
  • Skip to select language
MDN Web Docs
  • References
    • Overview / Web Technology

      Web technology reference for developers

    • HTML

      Structure of content on the web

    • CSS

      Code used to describe document style

    • JavaScript

      General-purpose scripting language

    • HTTP

      Protocol for transmitting web resources

    • Web APIs

      Interfaces for building web applications

    • Web Extensions

      Developing extensions for web browsers

    • Accessibility

      Build web projects usable for all

    • Web Technology

      Web technology reference for developers

  • Learn
    • Overview / MDN Learning Area

      Learn web development

    • MDN Learning Area

      Learn web development

    • HTML

      Learn to structure web content with HTML

    • CSS

      Learn to style content using CSS

    • JavaScript

      Learn to run scripts in the browser

    • Accessibility

      Learn to make the web accessible to all

  • Plus
    • Overview

      A customized MDN experience

    • AI Help

      Get real-time assistance and support

    • Updates

      All browser compatibility updates at a glance

    • Documentation

      Learn how to use MDN Plus

    • FAQ

      Frequently asked questions about MDN Plus

  • Curriculum New
  • Blog
    • Playground

      Write, test and share your code

    • HTTP Observatory

      Scan a website for free

    • AI Help

      Get real-time assistance and support

  • Log in
  • Sign up for free
  1. 개발자를 위한 웹 기술
  2. HTML: Hypertext Markup Language
  3. HTML 참고서
  4. HTML 요소 참고서
    • English (US)
    • Deutsch
    • Español
    • Français
    • 日本語
    • Português (do Brasil)
    • Русский
    • 中文 (简体)

이 페이지는 영어로부터 커뮤니티에 의하여 번역되었습니다. MDN Web Docs에서 한국 커뮤니티에 가입하여 자세히 알아보세요.

목차

  • 시도해 보기
  • 특성
  • 사용 일람
  • 예제
  • 접근성 고려사항
  • 명세
  • 브라우저 호환성
  1. HTML: Hypertext Markup Language
  2. 안내서:
  3. 콘텐츠 카테고리
  4. Comments
  5. HTML의 날짜와 시간 형식
  6. Constraint validation
  7. Viewport meta tag
  8. 반응형 이미지
  9. Microdata
  10. Microformats
  11. Quirks 모드
  12. HTML cheatsheet
  13. How to
  14. Define terms with HTML
  15. 데이터 속성 사용하기
  16. 교차 출처 이미지와 캔버스 허용하기
  17. Add a hitmap on top of an image
  18. Tips for Authoring Fast-loading HTML Pages
  19. Add JavaScript
  20. 참고서:
  21. 요소
    1. 지원이 중단되었습니다
    2. 지원이 중단되었습니다

    3. 지원이 중단되었습니다
    4. 지원이 중단되었습니다
    5. Experimental
    6. 지원이 중단되었습니다
    7. 지원이 중단되었습니다
    8. 지원이 중단되었습니다

상황에 맞는 구절 식별

다음 예제는 글의 검색 결과를 강조할 용도로 를 사용합니다.

html

It is a dark time for the Rebellion. Although the Death Star has been destroyed, Imperial troops have driven the Rebel forces from their hidden base and pursued them across the galaxy.

Evading the dreaded Imperial Starfleet, a group of freedom fighters led by Luke Skywalker has established a new secret base on the remote ice world of Hoth.

다른 와 검색 결과 표시를 구별하기 위해 사용자 지정 클래스 "match"를 추가로 적용했습니다.

접근성 고려사항

대부분의 스크린 리더는 기본값에서 요소의 존재를 표현하지 않습니다. 그러나 CSS content 속성과 ::before, ::after 의사 요소를 사용하면 소리내어 읽도록 할 수 있습니다.

css
mark::before,
mark::after {
  clip-path: inset(100%);
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

mark::before {
  content: " [강조 시작] ";
}

mark::after {
  content: " [강조 끝] ";
}

스크린 리더 사용자 일부는 지나치게 자세한 안내를 유발할 수 있는 콘텐츠의 표현을 의도적으로 꺼놓습니다. 그러므로 이 방식을 남용해선 안되며, 콘텐츠의 이해에 강조표시의 유무가 꼭 필요할 때만 사용해야 합니다.

  • Short note on making your mark (more accessible) | The Paciello Group
  • Tweaking Text Level Styles | Adrian Roselli

명세

Specification
HTML
# the-mark-element

브라우저 호환성

Help improve MDN

Learn how to contribute.

This page was last modified on 2025년 5월 7일 by MDN contributors.

View this page on GitHub • Report a problem with this content
MDN logo

Your blueprint for a better internet.

  • MDN on Bluesky
  • MDN on Mastodon
  • MDN on X (formerly Twitter)
  • MDN on GitHub
  • MDN Blog RSS Feed

MDN

  • About
  • Blog
  • Careers
  • Advertise with us

Support

  • Product help
  • Report an issue

Our communities

  • MDN Community
  • MDN Forum
  • MDN Chat

Developers

  • Web Technologies
  • Learn Web Development
  • MDN Plus
  • Hacks Blog
  • Website Privacy Notice
  • Cookies
  • Legal
  • Community Participation Guidelines

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998–2025 by individual mozilla.org contributors. Content available under a Creative Commons license.