<ruby> 标签是 HTML5 中的新标签,对于这个标签很多人比较陌生,也不太清楚它可以用来做什么,下面我就对这个标签做一个详细的讲解。

HTML5 <ruby> 标签用来定义文字注释(中文注音或字符)。

通常我们会将 <rp> 标签与 <ruby> 和 <rt> 标签一起使用。

<ruby> 元素由一个或多个需要解释/发音的字符和一个提供该信息的 <rt> 元素组成。

<rp> 元素用来定义当浏览器不支持 "ruby" 元素时显示的内容。

示例代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>给汉字加拼音</title>
</head>
<body>

<ruby>
行 <rp>(</rp><rt>xíng</rt><rp>)</rp>
走 <rp>(</rp><rt>zóu</rt><rp>)</rp>
的 <rp>(</rp><rt>de</rt><rp>)</rp>
代 <rp>(</rp><rt>dài</rt><rp>)</rp>
码 <rp>(</rp><rt>mǎ</rt><rp>)</rp>
</ruby>

</body>
</html>

示例效果:


Tespera

爱看书,爱看电影,偶尔也听听歌。喜欢写如诗的代码,热爱 IT 行业。熟悉 Web 前端开发,了解 C、Python、PHP 等计算机语言。

3 Comments
子非鱼 2019-04-30 23:22

"多年以来,我认识到,当你拥有真正优秀的人才时,你不必对他们太纵容,"乔布斯后来解释说:"你期待他们做出好成绩,你就能让他们做出好成绩。 最初的 Mac 团队让我知道,最顶级的人才喜欢一起工作,而且他们是不能容忍平庸作品的。你到那个 Mac 团队里随便找个人问问,他们会告诉你,那些痛苦都是值得的。"

Post your comment