HTML <rp> Tag
The HTML <rp>
tag is used to provide fallback text for browsers that do not support the <ruby>
element. The <ruby>
element is used to display annotations, such as pronunciation guides, for East Asian typography (e.g., Chinese, Japanese, or Korean). The <rp>
tag ensures that the content remains readable in browsers that do not render the <ruby>
element properly.
The <rp>
tag typically contains parentheses or other markers that enclose the ruby text, ensuring a visual fallback for unsupported environments.
Basic Syntax of HTML <rp> Tag
The <rp>
tag is used within the <ruby>
element, along with the <rt>
tag (ruby text), as shown:
<ruby>
Base Text
<rp>(</rp>
<rt>Ruby Text</rt>
<rp>)</rp>
</ruby>
The <rp>
tag provides parentheses around the ruby text for browsers that do not support ruby annotations.
Example of Using the <rp> Tag
Here’s an example of how the <rp>
tag works within a <ruby>
element:
index.html
<!DOCTYPE html>
<html>
<body>
<h2>Ruby Annotation Example</h2>
<p>
<ruby>
漢字
<rp>(</rp>
<rt>kanji</rt>
<rp>)</rp>
</ruby>
</p>
</body>
</html>
Explanation: In browsers that support the <ruby>
element, “kanji” is displayed as a pronunciation guide above “漢字”. In unsupported browsers, the text will appear as “漢字(kanji)”.
Attributes of HTML <rp> Tag
- No Attributes: The
<rp>
tag does not have any specific attributes. - Global Attributes: Supports all global attributes, such as
id
,class
, andstyle
.
Practical Applications of the <rp> Tag
- Fallback Text: Ensure that ruby annotations remain readable on browsers that don’t support the
<ruby>
element. - Cross-Browser Compatibility: Provide a user-friendly fallback for older browsers while maintaining semantic integrity.
- Accessibility: Enhance readability for users who rely on visual cues like parentheses to understand ruby annotations.