HTML - rp 标签

HTML <rp> 标签用于为不支持使用 <ruby> 标签显示 ruby 注释的浏览器提供 ruby 文本周围的回退括号。这是 HTML5 中包含的新标签。<rp> 标签必须用括号将 <rt> 标签括起来，括号包含批注的文本。

语法


<rp>.....</rp>

属性

<rp> 标签支持 HTML 的全局属性和事件属性。

<rp> 标签示例

在下面的示例中，我们将看到用例，在哪里以及如何使用 <rp> 标签在 ruby 文本周围提供回退括号。

<rp> 标签封闭 Ruby 文本

在下面的示例中，我们将使用 <rp> 标签创建一个 ruby 文本封闭。


<!DOCTYPE html>
<html>
<head>
	 <style>
			ruby {
				 font-size: 2em;
			}
	 </style>
</head>
<body>
	 <ruby> 漢 <rp>(</rp>
			<rt>kan</rt>
			<rp>)</rp> 字 <rp>(</rp>
			<rt>ji</rt>
			<rp>)</rp>
	 </ruby>
</body>
</html>

<rp> 设置css样式示例

考虑以下示例，我们正在使用 <rp> 标签创建一个 HTML 文档，并使用 CSS 属性对其进行样式设置。


<!DOCTYPE html>
<html>
<head>
	 <style>
			body {
				 text-align: center;
			}

			ruby {
				 font-size: 3em;
				 color: green;
			}
	 </style>
</head>
<body>
	 <h3>HTML rp Tag</h3>
	 <ruby> 漢 <rp>(</rp>
			<rt>kan</rt>
			<rp>)</rp> 字 <rp>(</rp>
			<rt>ji</rt>
			<rp>)</rp>
	 </ruby>
</body>
</html>

在不受支持的 Ruby 注释上应用 rp 标签

让我们看一下下面的例子，我们将使用 <rp> 元素向不支持 Ruby 注解的用户代理显示括号。


<!DOCTYPE html>
<html>
<head>
	 <style>
			body {
			text-align: center;
			}

			ruby {
			font-size: 2em;
			color: #808000;
			}
	 </style>
</head>
<body>
	 <h3>Example of rp tag </h3>
	 <ruby> 漢 <rp>(</rp>
			<rt>かん</rt>
			<rp>)</rp> 字 <rp>(</rp>
			<rt>じ</rt>
			<rp>)</rp>
	 </ruby>
</body>
</html>

支持的浏览器

浏览器
<rp>	Yes	Yes	Yes	Yes	Yes

打印本页