HTML ruby 标签

🌙
手机阅读
本文目录结构
axihe

HTML <ruby> 标签功能

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

在东亚使用,显示的是东亚字符的发音。

<ruby> 标签与 <rt> 和 <rp> 标签一起使用: <ruby> 元素由一个或多个需要解释 / 发音的字符和一个提供该信息的 <rt> 元素组成,还包括可选的 <rp> 元素,定义当浏览器不支持 “ruby” 元素时显示的内容。

HTML <ruby> 标签用法

ruby 注释:

<ruby>
    <rb>阿西河前端教程</rb>
    <rt>A Xi He Qian Duan Jiao Cheng</rt>
</ruby>
<ruby>
  阿 <rp>(</rp><rt>A</rt><rp>)</rp>
  西 <rp>(</rp><rt>Xi</rt><rp>)</rp>
  河 <rp>(</rp><rt>He</rt><rp>)</rp>
  前 <rp>(</rp><rt>Qian</rt><rp>)</rp>
  端 <rp>(</rp><rt>Duan</rt><rp>)</rp>
  教 <rp>(</rp><rt>Jiao</rt><rp>)</rp>
  程 <rp>(</rp><rt>Cheng</rt><rp>)</rp>
</ruby>
<ruby>
  明 日 <rp>(</rp><rt>ming ri</rt><rp>)</rp>
</ruby>
<ruby>
  明 <rp>(</rp><rt>ming</rt><rp>)</rp>
  日 <rp>(</rp><rt>ri</rt><rp>)</rp>
</ruby>

HTML <ruby> 标签演示

注意观察 阿西河前端教程 上面拼音的位置;

阿西河前端教程A Xi He Qian Duan Jiao Cheng

(A) 西 (Xi)(He)(Qian)(Duan)(Jiao)(Cheng)


明 日 (ming ri)

(ming)(ri)

浏览器支持

IE 9+、Firefox、Opera、Chrome 和 Safari 支持 <ruby> 标签。

注释:IE 8 或更早版本的 IE 浏览器不支持 <ruby> 标签。

HTML4 与 HTML5 之间的差异

<ruby> 标签是 HTML5 中的新标签。

全局属性

<ruby> 标签支持 HTML 全局属性

事件属性

<ruby> 标签支持 HTML 事件属性


AXIHE / 精选资源

浏览全部教程

面试题

学习网站

前端培训
自己甄别

前端书籍

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili 和抖音。

关注我: Github / 知乎

如果你加我的私人微信,麻烦写上您的 称呼,所在地区,职业,方便我备注,谢谢


本站的微信公众号

阿西河前端教程

Anbang

安邦的私人微信

微信号: yaolushan

Anbang

Bilibili(B站)

朱安邦

Anbang