HTML rp 标签 - 绿叶网

HTML rp 语法

rp 是 HTML 中的一个小众标签，它通常搭配 ruby 和 rt 标签一起使用，用于显示音标或注音文字的备用内容。当浏览器不支持 ruby 标签时，就会显示 rp 的内容。

也就是说，如果浏览器无法识别或显示 ruby 的注音结构，rp 标签则可以提供了一个 “退而求其次的显示方案”，从而让用户依然能看到某些信息，而不是出现空白或乱码。

语法：

<ruby>
    原文
    <rt>注音</rt>
    <rp>（注音显示不了时的备用文字）</rp>
</ruby>

说明：

ruby 包裹着 rt 和 rp，rt 定义音标内容。

HTML rp 摘要

属于	HTML 标签
使用频率	低
兼容性	查看
官方文档	查看
MDN	查看

HTML rp 示例

接下来，我们通过一个简单的例子来讲解一下 HTML rp 标签是如何使用的。

示例：rp 标签的基本用法

运行代码

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
</head>
<body>
    <ruby>
        绿叶网
        <rp>（</rp>
        <rt>lǜ yè wǎng</rt>
        <rp>）</rp>
    </ruby>
</body>
</html>

页面效果如下图所示。

HTML rp标签示例

分析：

只有当浏览器支持 ruby 元素时，才会显示为正常的注音效果（括号被隐藏）。当浏览器不支持 ruby 时，显示为绿叶网（lǜ yè wǎng），这才是 rp 标签存在的真正意义——优雅降级。