CSS 兼容IE和火狐的文字竖排
- 作者：网页模板
- 类型：图文教程
- 点击次数：
- 发布时间：2014-04-03 10:37
一、writing-mode文字竖排（不兼容火狐）
首先请运行下面的代码查看效果(请在火狐和IE下都运行下)：
由于不兼容火狐，所以不推荐这种方法实现文字竖排。
注：上面代码的text-indent:2em 是首行缩进，2em刚好是两个汉字，四个英文字符。
二、用ul模拟文字竖排
还是在火狐和IE下运行下面的代码：
1)把每句话写进一个li里面，然后把li右浮动，即“float:right;”这么做是为了阅读顺序从右往左。
2)li的宽度设置成和字一样的大小，例如14px等，这样是为了让一列只显示一个字。
3)加上word-wrap:break-word;和word-break:nomal;，强制把标点符号和字母也换行。
(责任编辑：网页模板)
首先请运行下面的代码查看效果(请在火狐和IE下都运行下)：
提示：您可以先修改部分代码再运行
由于不兼容火狐，所以不推荐这种方法实现文字竖排。
注：上面代码的text-indent:2em 是首行缩进，2em刚好是两个汉字，四个英文字符。
二、用ul模拟文字竖排
还是在火狐和IE下运行下面的代码：
提示：您可以先修改部分代码再运行
1)把每句话写进一个li里面，然后把li右浮动，即“float:right;”这么做是为了阅读顺序从右往左。
2)li的宽度设置成和字一样的大小，例如14px等，这样是为了让一列只显示一个字。
3)加上word-wrap:break-word;和word-break:nomal;，强制把标点符号和字母也换行。
(责任编辑：网页模板)
- 本文标签：
- 兼容IE和火狐的文字竖排,css文字竖排
