<p style="text-align:center"><bdo dir="RTL">芙蓉楼送辛渐</bdo></p>
<p style="text-align:center"><bdo dir="RTL">王昌龄</bdo></p>
<p style="text-align:center"><bdo dir="RTL">寒雨连江夜入吴,</bdo></p>
<p style="text-align:center"><bdo dir="RTL">平明送客楚山孤。</bdo></p>
<p style="text-align:center"><bdo dir="RTL">洛阳亲友如相问,</bdo></p>
<p style="text-align:center"><bdo dir="RTL">一片冰心在玉壶。</bdo></p>

效果如下:

芙蓉楼送辛渐

王昌龄

寒雨连江夜入吴,

平明送客楚山孤。

洛阳亲友如相问,

一片冰心在玉壶。

可以看到文字从右到左排序了,明显的这是dir属性的功劳。但是如果dir属性不镶嵌在bdo标签上是不会如此执行的,dir属性可以说和bdo标签相互依存(bdo 元素可覆盖默认的文本方向。)

如果把dir放在了其他标签上效果就变成如下的样子了,例如

 <p dir="rtl">洛阳亲友如相问,一片冰心在玉壶。</p>   

洛阳亲友如相问,一片冰心在玉壶。

效果如上,dir="rtl"得到了有text-align:right和句子从右到左排列的效果,但是句子中文字的排列仍然保留默认的从左往右

HTML5之dir属性的更多相关文章

  1. HTML5新增的属性

    关于html5新增的属性: HTML5现在已经不是SGML的子集,主要是增加了关于图像,位置,存储,多任务等功能. 绘画CANVAS; 用于播放媒体的video和audio元素: 本地离线存储loca ...

  2. 利用Jquery使用HTML5的FormData属性实现对文件的上传

    1.利用Jquery使用HTML5的FormData属性实现对文件的上传 在HTML5以前我们如果需要实现文件上传服务器等功能的时候,有时候我们不得不依赖于FLASH去实现,而在HTML5到来之后,我 ...

  3. HTML5 INPUT新增属性

    HTML5的input标签新增了很多属性,也是让大家非常兴奋的一件事,用简单的一个属性搞定以前复杂的JS验证.input新增的这些属性,使得html和js的分工更明确了,使用起来十分舒畅.我们先看下i ...

  4. HTML5它contenteditable属性

    HTML5它contenteditable属性 1.功能说明 (1)功能:同意用户编辑元素中的内容 (2)说明:是一个布尔值.false是不能编辑,true为可编辑 2.分析实例 (1)content ...

  5. HTML5之contenteditable属性

    HTML5之contenteditable属性 1.功能说明 (1)功能:允许用户编辑元素中的内容 (2)说明:是一个布尔值,false是不能编辑,true为可编辑 2.分析实例 (1)content ...

  6. 服务器变量 超级全局数组$_SERVER (附加超简单表单与html5表单属性)

    001.html <html> <head><title>user log</title> <meta http-equiv="cont ...

  7. html5的float属性超详解(display,position, float)(文本流)

    html5的float属性超详解(display,position, float)(文本流) 一.总结 1.文本流: 2.float和绝对定位都不占文本流的位置 3.普通流是默认定位方式,就是依次按照 ...

  8. HTML5: HTML5 表单属性

    ylbtech-HTML5: HTML5 表单属性 1.返回顶部 1. HTML5 表单属性 HTML5 新的表单属性 HTML5 的 <form> 和 <input>标签添加 ...

  9. html5的placeholder属性(IE如何兼容placeholder属性)

    界面UI推荐 jquery html5 实现placeholder兼容password  IE6 html5的placeholder属性(IE如何兼容placeholder属性) 2013-01-05 ...

随机推荐

  1. VMwareTools安装失败提示找不到C headers和gcc目录

    在VMware虚拟机上安装好linux系统后,发现往往不能全屏,也不能设置共享文件夹进行文件共享,这时候可以通过安装VMwareTools这个工具来实现文件拖拽.共享和全屏. 安装的过程不再赘述,关键 ...

  2. "HK"日常之制作一只QQ刷屏

    刷屏器是什么?可以吃吗?如果可以吃它好吃吗? um. 刷屏器就是可以定时发生信息的东西 刷屏器可以应用于很多方面,例如别人不理你了或者在QQ斗图的时候.警告:本教程仅作为学习研究,禁止其他用途!--- ...

  3. JS实现悬浮导航的制作--web前端

    思想:导航在这里只有两种状态,一种是初始状态.一种是固定布局状态.实现悬浮导航其实就是通过Javascript脚本语言控制导航的两种状态,主要是对两种状态成立条件的判断,明确了这些,实现起来就不会太难 ...

  4. 两个java项目,跨域访问时,浏览器不能正确解析数据问题

    @Controller@RequestMapping(value = "api/item/cat")public class ApiItemCatController { @Aut ...

  5. Android项目导入工程Module

    在Android开发过程中,我们经常引用一些模块,或者自己封装好的Project.在Android Studio某个项目是可以引入多个Module的.这样导入Module的好处方便对源码修改以适合自己 ...

  6. vue vuex的用法

    1.引入  vue.js    vuex.js 文件 2.创建Store文件 var sSatte=new Vuex.Store({ state:{}, mutations:{}, actions:{ ...

  7. PHP超全局变量$_SERVER

    $_SERVER 是一个包含了诸如头信息(header).路径(path).以及脚本位置(script locations)等等信息的数组.这个数组中的项目由 Web 服务器创建.不能保证每个服务器都 ...

  8. angularjs-1.3代码学习 模块

    花了点时间,阅读了下angularjs的源码.本次先从模块化开始. angular可以通过module的api来实现前端代码的模块化管理.跟define类似.但不具备异步加载脚本的功能.先从最基本的m ...

  9. Struts2入门项目开发小步骤

    Step1: Struts2的获取和添加到项目中: 在官方网站:http://struts.apache.org 获取Struts的其中一个版本. 在开发项目之前,需要添加struts2的类库支持,也 ...

  10. jenkins-APP打包页面展示二维码

    背景: 客户要求在APP打包页面展示二维码.虽然感觉这个功能很鸡肋,但是还是加上吧. 效果展示: 配置: 在上图中,106对应的内容是BuildName,我们可以通过build-name-setter ...