writing-mode属性 实现文字垂直排版

下面是css3语法:

 /* 关键字值 */
writing-mode: horizontal-tb; /* 默认值 */
writing-mode: vertical-rl;
writing-mode: vertical-lr; /* 全局值-关键字inherit IE8+,initial和unset IE13才支持 */
writing-mode: inherit;
writing-mode: initial;
writing-mode: unset;

默认值horizontal-tb表示,文本流是水平方向(horizontal)的,元素是从上往下(tb:top-bottom)堆叠的。

vertical-rl表示文本是垂直方向(vertical)展示,然后阅读的顺序是从右往左(rl:right-left),跟我们古诗的阅读顺序一致。
vertical-lr表示文本是垂直方向(vertical)展示,然后阅读的顺序还是默认的从左往右(lr:left-right),也就是仅仅是水平变垂直。

css:writing-mode属性的更多相关文章

  1. CSS之cursor属性

    CSS之cursor属性 今天学习了CSS的cursor属性,第一篇博客就用来总结它吧. cursor属性用于控制光标的显示样式,可取的值有这些: cursor:url()*|{auto|defaul ...

  2. CSS样式常用属性整理

    web工程师是最近5年刚刚兴起的一门高薪职业,人们的专注度越来越高. 那么前端除了学习html标签之外还需要掌握什么知识点呢? 为大家整理了一个和HTML标签密不可分的知识要点--<CSS样式常 ...

  3. CSS中box-sizing属性的理解与部分用法

    今天看了一些关于box-sizing的一些资料,在这里整理一下,希望也能对大家有所帮助. box-sizing是CSS的一个属性,很好的解决了盒模型的相关问题.CSS中的盒模型(Box model)分 ...

  4. 深入理解css中position属性及z-index属性

    深入理解css中position属性及z-index属性 在网页设计中,position属性的使用是非常重要的.有时如果不能认识清楚这个属性,将会给我们带来很多意想不到的困难. position属性共 ...

  5. CSS Counters 计数属性

    CSS Counters其实就是一计数器,早期在CSS中计数器仅存在于ul和ol元素.如果要使用在div这样的元素上,只能通过list-style-image或者是元素的backgroud-image ...

  6. 利用CSS的@font-face属性 在网页中嵌入字体

    字体使用是网页设计中不可或缺的一部分.网页是文字的载体,我们希望在网页中使用某一特定字体,但是该字体并非主流操作系统的内置字体,这样用户在浏览页面的时候就有可能看不到真实的设计. 美工设计师最常做的办 ...

  7. CSS中Position属性

    也许你看到这个标题觉得很简单,确实这是一篇关于CSS中Position属性基础知识的文章,但是关于Position的一些细节也许你不了解. 1.简介 position有五个属性: static | r ...

  8. [转] CSS float 浮动属性

    http://www.cnblogs.com/polk6/p/3142187.html CSS float 浮动属性 本篇主要介绍float属性:定义元素朝哪个方向浮动. 目录: 1. 页面布局方式: ...

  9. CSS背景特殊属性值

    CSS代码示例-背景附着属性(background-attachment)-[背景图固定不动,不跟随滚动条滚动]:<html><head><title>背景附着属性 ...

  10. 怎样通过css的media属性,适配不同分辨率的终端设备?

    怎样通过css的media属性,适配不同分辨率的终端设备,示比例如以下: <!DOCTYPE html> <html> <head> <title>首页 ...

随机推荐

  1. 【转】 linux编程之GDB调试

    GDB是一套字符界面的程序集,可以用它在linux上调试C和C++程序,它提供了以下的功能: 1 在程序中设置断点,当程序运行到断点处暂停 2 显示变量的值,可以打印或者监视某个变量,将某个变量的值显 ...

  2. Appium 服务关键字

    Appium 服务关键字 关键字 描述 实例 automationName 你想使用的自动化测试引擎 Appium (默认) 或 Selendroid platformName 你要测试的手机操作系统 ...

  3. mysql执行大量sql语句

    今天需要通过csv上传大量数据到数据库 直接逐行执行insert效率极其低下 后面通过拼接insert,稍微提高了些许效率,但依然不满足 最后发现,把这些插入放入同一个事务里面可以大大提高效率 beg ...

  4. java中参数传递方式

    在 Java 应用程序中永远不会传递对象,而只传递对象引用.因此是按引用传递对象.Java应用程序按引用传递对象这一事实并不意味着 Java 应用程序按引用传递参数.参数可以是对象引用,而 Java ...

  5. python 基本语法

    第一个python程序 打开Sublime Text -->输出 print"Hello World" -->保存为frist.py -->打开命令行运行,运行p ...

  6. 配置MAVEN出现错误:java_home not found in your enviroment

    配置好maven后检测是否配置成功出现错误:java_home not found in your enviroment 找问题: 1.cmd--> path  看路径是否正确 2.cmd--& ...

  7. Spring 相关jar包详细介绍

    文章转自:http://blog.csdn.net/farawayhome/article/details/6623946 aspectj目录下是在Spring框架下使用aspectj的源代码和测试程 ...

  8. 企业项目开发--分布式缓存Redis

    第九章 企业项目开发--分布式缓存Redis(1) 注意:本章代码将会建立在上一章的代码基础上,上一章链接<第八章 企业项目开发--分布式缓存memcached> 1.为什么用Redis ...

  9. POJ1635 树的最小表示

    /*zoj1990Subway Tree Systems题目大意:初始时站在树的根节点,若朝着远离根的方向走,记录“”,接近根的方向走记录“”.并且树的每一条边只能来回走一次(即向下和返回).一个合法 ...

  10. ubuntu下部署SVN

    sudo apt-get install subversion 创建库文件夹 sudo mkdir svn sudo chown -R 777 svn 设置为所有用户配置777权限 sudo chmo ...