ruby(html)
有的时候,我们要给汉字标记拼音,让拼音显示要汉字的上面
<ruby>中国人<rp>(</rp><rt>zhong guo ren</rt><rp>)</rp></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)的更多相关文章
- 安装cocoapods遇到两大坑-Ruby版本升级和Podfile的配置
今天安装cocoapods #移除原有ruby源 $ gem sources --remove https://rubygems.org/ #使用可用的淘宝网 $ gem sources -a htt ...
- 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 ...
- 安装了ruby后怎么安装sass
在命令行中输入 ruby -v 查看版本号 先移除默认的https://rubygems.org源,命令为gem sources --remove https://rubygems.org/,按回车 ...
- ruby 基础知识(一)
突然今天发现一大神的博客:http://www.cnblogs.com/jackluo/archive/2013/01/22/2871655.html 相信初学者会受益颇多 ruby 参考文档 ...
- ruby 基础知识(二)
ruby 中的动态方法 http://singleant.iteye.com/blog/1680382 Rails 大量使用了符号(symbol).符号看上去很像变量名,不过以冒号作为前缀.符号的例 ...
- Ruby安装Scss
Ruby安装Scss 引言 已经许久不写HTML了,今天有点以前的东西要改.但是刚装的Windows10,已经没有以前的Web开发环境了.只好重新安装. 结果Webstorm装好后配置Scss出现错误 ...
- fzf by ruby
fzf by ruby */--> fzf by ruby 1 github地址 https://github.com/junegunn/fzf 2 简介 软件通过匿名管道和grep扩展了bas ...
- The Safe Navigation Operator (&.) in Ruby
The most interesting addition to Ruby 2.3.0 is the Safe Navigation Operator(&.). A similar opera ...
- Ruby on Rails 创建https应用
1. 创建证书请求文件条件:私钥+证书签名请求+opensslyum install -y opensslmkdir /root/ssl/ && cd /root/ssl/openss ...
- Ruby数组
Ruby数组是有序的,任何对象的整数索引的集合.每个数组中的元素相关联,并提取到的一个索引.下标与C或Java相似,从0开始.负数索引假设数组末尾,也就是说-1表示最后一个元素的数组索引,-2是数组中 ...
随机推荐
- 【转】工科男IT职场求生法则
转自:http://www.36dsj.com/archives/3459 我在IT职场打滚超过10年了,从小小的程序员做到常务副总.相对于其它行业,IT职场应该算比较光明的了,但也陷阱重重,本文说说 ...
- socket 怎么设置心跳判断连接
server的代码public abstract class Server { static readonly ILog logger = LogManager.GetLogger(typeof(Se ...
- CSS样式如何解决IE浏览器不同版本的兼容问题
如果你想让浏览器是固定的IE6版本,那么你做网页的时候在<head>后面加上一句话: <meta http-equiv="X-UA-Compatible" con ...
- iOS开发——动画编程Swift篇&(五)CAKeyframeAnimation
CAKeyframeAnimation //CAKeyframeAnimation-关键针动画 @IBAction func cakFly() { let animation = CAKeyframe ...
- Busybox支持中文的解决办法
转载:http://blog.csdn.net/wavemcu/article/details/7202908 ******************************************** ...
- JSON使用——获取网页返回结果是Json的代码
public String getWebData(String strUrl){ String json = null; try { URL url = new URL(strUrl); HttpUR ...
- Data Structure 之 二叉树
在计算机科学中,二叉树是每个节点最多有两个子树的树结构.通常子树被称作“左子树”(left subtree)和“右子树”(right subtree).二叉树常被用于实现二叉查找树和二叉堆 ...
- Spring MVC学习笔记02
1.常用注解 1.@Autowired,它可以对类成员变量.方法及构造函数进行标注,完成自动装配的工作. <!-- 该 BeanPostProcessor 将自动起作用,对标注 @Autowir ...
- Windows OpenVPN Client and tls-auth
The official Windows OpenVPN client does not seem to work properly with the tls-auth option if a key ...
- 结合源码看nginx-1.4.0之nginx多进程机制详解
目录 0. 摘要 1. nginx多进程设计思想 2. nginx多进程设计数据结构 3. nginx进程间通信机制 4. 一个简单的多进程例子 5. 小结 6. 参考源码