有的时候,我们要给汉字标记拼音,让拼音显示要汉字的上面

<ruby>中国人<rp>(</rp><rt>zhong guo ren</rt><rp>)</rp></ruby>

效果如图:

<ruby> …… ルビをふる
  

<ruby><rt><rp>は ルビをふる際に使用します。

<rt>はRuby Textの略でルビのテキストを、 <rp>はRuby Parenthesesの略でルビのテキストを囲む括弧等の記号を、それぞれ指定します。 <rt>と<rp>は、<ruby>~</ruby>の中で子要素として使用します。

<rp>~</rp>の内容は、<ruby>タグに対応したブラウザでは無視されます。 <ruby>タグに対応していないブラウザでは、 漢(かん)字(じ) のように表示されます。

■HTML4.01からHTML5へのバージョンアップによる変更点

<ruby>・<rt>・<rp>は、すでにInternet Explorer5以降で先行採用されていますが、HTML5では標準仕様となります。 ただし、Ruby Baseの略でルビをふる対象となる文字本体を示す<rb>は採用されない予定です。 HTML5では、<rb>タグは省略して<ruby>~</ruby>内に直接ルビベースを記述します。

※それぞれの旧ページ: <RUBY>・ <RB>・ <RT>・ <RP>

■使用例

HTMLソース

<ruby>
漢<rt>かん</rt>
字<rt>じ</rt>
</ruby><br>

<ruby>
漢<rp>(</rp><rt>かん</rt><rp>)</rp>
字<rp>(</rp><rt>じ</rt><rp>)</rp>
</ruby>

ruby(html)的更多相关文章

  1. 安装cocoapods遇到两大坑-Ruby版本升级和Podfile的配置

    今天安装cocoapods #移除原有ruby源 $ gem sources --remove https://rubygems.org/ #使用可用的淘宝网 $ gem sources -a htt ...

  2. Unable to download data from http://ruby.taobao.org/ & don't have write permissions for the /Library/Ruby/Gems/2.0.0 directory.

    安装cocoapods,记录两个问题! 1.镜像已经替换成了 http://ruby.taobao.org/, 还是不能不能安装cocoapods, 报错:Unable to download dat ...

  3. 安装了ruby后怎么安装sass

    在命令行中输入 ruby -v 查看版本号 先移除默认的https://rubygems.org源,命令为gem sources --remove https://rubygems.org/,按回车 ...

  4. ruby 基础知识(一)

    突然今天发现一大神的博客:http://www.cnblogs.com/jackluo/archive/2013/01/22/2871655.html    相信初学者会受益颇多 ruby  参考文档 ...

  5. ruby 基础知识(二)

    ruby  中的动态方法 http://singleant.iteye.com/blog/1680382 Rails 大量使用了符号(symbol).符号看上去很像变量名,不过以冒号作为前缀.符号的例 ...

  6. Ruby安装Scss

    Ruby安装Scss 引言 已经许久不写HTML了,今天有点以前的东西要改.但是刚装的Windows10,已经没有以前的Web开发环境了.只好重新安装. 结果Webstorm装好后配置Scss出现错误 ...

  7. fzf by ruby

    fzf by ruby */--> fzf by ruby 1 github地址 https://github.com/junegunn/fzf 2 简介 软件通过匿名管道和grep扩展了bas ...

  8. The Safe Navigation Operator (&.) in Ruby

    The most interesting addition to Ruby 2.3.0 is the Safe Navigation Operator(&.). A similar opera ...

  9. Ruby on Rails 创建https应用

    1. 创建证书请求文件条件:私钥+证书签名请求+opensslyum install -y opensslmkdir /root/ssl/ && cd /root/ssl/openss ...

  10. Ruby数组

    Ruby数组是有序的,任何对象的整数索引的集合.每个数组中的元素相关联,并提取到的一个索引.下标与C或Java相似,从0开始.负数索引假设数组末尾,也就是说-1表示最后一个元素的数组索引,-2是数组中 ...

随机推荐

  1. JS原生方法实现jQuery的ready()

    浏览器加载页面的顺序: 1. 解析HTML结构 2. 加载外部脚本和样式表文件 3. 解析并执行脚本代码 4. 构造HTML DOM模型==ready() 5. 加载图片等组件 6. 页面加载完毕== ...

  2. 如何修改meclipse中的默认浏览器

    window------->preferrences------------>general-------------->web browser---------->选择你要使 ...

  3. 广州项目实施步骤III_练习使用Keepalive保证HaProxy的高可用性

    CentOS6.4 配置HAProxy+Keepalived   安装HAProxy请参考 http://www.cnblogs.com/kgdxpr/p/3272861.html 安装Keepali ...

  4. Mysql权限控制 - 允许用户远程连接

    Mysql为了安全性,在默认情况下用户只允许在本地登录,可是在有此情况下,还是需要使用用户进行远程连接,因此为了使其可以远程需要进行如下操作: 一.允许root用户在任何地方进行远程登录,并具有所有库 ...

  5. Shadow Mapping 的原理与实践(一)

    早在上世纪七十年代末,Williams在他的“Casting Curved Shadows on Curved Surface”一文中提出了名为Shadow Map的阴影生成技术.之后,他人在此基础上 ...

  6. wget 命令用法详解

    wget是在Linux下开发的开放源代码的软件,作者是Hrvoje Niksic,后来被移植到包括Windows在内的各个平台上.它有以下功能和特点:(1)支持断点下传功能:这一点,也是网络蚂蚁和Fl ...

  7. android中判断sim卡状态和读取联系人资料的方法

    在写程序中,有时候可能需要获取sim卡中的一些联系人资料.在获取sim卡联系人前,我们一般会先判断sim卡状态,找到sim卡后再获取它的资料,如下代码我们可以读取sim卡中的联系人的一些信息. Pho ...

  8. iOS开发——开发必备OC篇&UITableView设置界面完整封装(二)

    UITableView设置界面完整封装(二) 简单MVC实现UITableView设置界面之Cell右边类型设置 首先来看看第一种方法证明使用,结合两种方法之后根据个人的爱好去选择就可以了, 一:使用 ...

  9. JavaScript目录

    1. 如何快速检查js语法学习Javascript 2. 如何快速掌握CSS(各种CSS工具)

  10. GNU-ARM汇编

    GNU ARM 汇编指令(2008-10-29 00:16:10) 标签:linux gnu arm 汇编指令 it 分类:技术文摘 第一部分 Linux下ARM汇编语法尽管在Linux下使用C或C+ ...