Computer >> 컴퓨터 >  >> 프로그래밍 >> HTML

HTML rp 태그 – 루비(ruby) 주석을 지원하지 않는 브라우저를 위한 대체 표시 방법

HTML의 <rp>(Ruby Parenthesis) 태그는 루비(ruby) 주석을 지원하지 않는 브라우저에서 표시할 대체 내용을 지정하는 데 사용됩니다. 루비 주석은 일본어 후리가나처럼 한자 위에 발음을 작게 덧붙여 표기하는 동아시아 타이포그래피 기법으로 널리 활용됩니다.

<rp> 태그의 역할

루비 주석은 세 가지 태그가 서로 협력하여 구현됩니다.

  • <ruby>: 루비 주석 전체를 감싸는 컨테이너 역할
  • <rt>: 실제 화면에 표시되는 루비 텍스트(발음, 읽는 법 등)
  • <rp>: 루비를 지원하지 않는 브라우저에서만 보이는 괄호 같은 대체 문자

루비 주석을 지원하는 브라우저에서는 <rp> 안의 내용이 자동으로 숨겨집니다. 반면 지원하지 않는 브라우저에서는 괄호와 함께 발음이 본문 옆에 나타나 독자가 읽는 법을 쉽게 파악할 수 있도록 도와줍니다.

예제

다음 코드를 실행하면 <rp> 태그의 실제 동작을 확인할 수 있습니다.

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Rp Tag</title>
   </head>
   <body>
      <ruby>
         漢 <rp>(</rp><rt>Kan</rt><rp>)</rp>
         字 <rp>(</rp><rt>ji</rt><rp>)</rp>
      </ruby>
   </body>
</html>

실행 결과

루비 주석을 지원하는 브라우저에서는 '漢字' 글자 위에 'Kan'과 'ji'가 작은 글씨로 표시됩니다. 반면 지원하지 않는 브라우저에서는 漢(Kan)字(ji)처럼 괄호와 함께 발음이 글자 옆에 나타나므로, 어떤 환경에서도 의미가 명확하게 전달됩니다.