HTML - <ruby> 标签

HTML <ruby> 标签用于指定 ruby 注解。它是一个附加在主文本上的小文本，用于说明主文本的含义。通常用于显示汉语、日语等东亚字符的发音。这是 HTML5 中新增的一个标签。它还可以用于表示与主要内容相关的少量注释。

语法

<ruby>.....</ruby>

属性

HTML ruby 标签支持 HTML 的全局和事件属性。

HTML ruby 标签示例

在以下示例中，我们将看到使用案例，以及如何在 HTML 文档中使用 HTML ruby 标签来指定 ruby 注解。

指定 ruby 元素

在以下示例中，让我们看看 <ruby> 标签在 HTML 文档中的工作原理。

<!DOCTYPE html>
<html>
<head>
   <style>
      ruby {
         font-size: 30px;
         font-style: italic;
         color: red;
      }
   </style>
</head>
<body>
   <h1>Tutorialspoint</h1>
   <h2>HTML ruby Tag</h2>
   <!-- here, using ruby tag -->
   <ruby>
      TP <rt>tutorialspoint </rt> EL <rt> Easy to learn </rt>
   </ruby>
</body>
</html>

东亚语言和普通注释

考虑以下示例，我们正在创建 <ruby> 元素来解释东亚语言注释和普通注释。

<!DOCTYPE html>
<html>
<head>
   <style>
      rt {
         font-size: 20px;
         color: green;
      }
   </style>
</head>
<body>
   <h1>HTML ruby Tag</h1>
   <p>East Asian Language Annotation</p>
   <ruby> 小弟弟 <rt>Small Brother</rt>
   </ruby>
   <p>
      Normal Annotation Representation of Manufactured date
   </p>
   <ruby> 19 <rp>(</rp>
      <rt>Date</rt>
      <rp>)</rp> 06 <rp>(</rp>
      <rt> Month</rt>
      <rp>)</rp> 2023 <rp>(</rp>
      <rt>Year</rt>
      <rp>)</rp>
   </ruby>
</body>
</html>

与 HTML ruby 标签一起使用的标签

HTML <rt> 标签 描述主文本上方主文本的解释
HTML <rp> 标签 这是一个可选标签，用于指定当浏览器不支持 Ruby 注解时需要显示的信息。

支持的浏览器

标签
ruby	是 5.0	是 5.5	是 38.0	是 5.0	是 15.0

html_tags_reference.htm

打印页面