最近在做一个项目的时候用到了网页文字竖排的效果,于是在网上进行搜索,找到了两种方法:一种是设置CSS样式为:writing-mode:tb-rl;另一种是设置CSS样式为:layout-flow: vertical-ideographic;,但是这两种方法只适用于IE浏览器,在Firefox中无效啊,郁闷~!不过最终还是把问题解决了,赶快拿来分享!
其实解决这个问题最简单的方法就是设置好DIV的字符宽度,经过多次测试,如果是中文字竖排,将宽度设置为1.5em为最佳,具体的代码如下所示:
<div style="width:1.5em; ">研究互联网络和电脑应用技术的IT技术网</div>
输出结果如下所示:
研究互联网络和电脑应用技术的IT技术网