本文介绍了一种使用CSS实现文本垂直排版的方法。通过调整writing-mode属性，可以使文本以从上到下、从右到左的方式显示。示例代码展示了如何设置div元素的样式使其内容垂直排列，并保持合适的宽度和高度。
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 <style type="text/css"> 7 /*修改书写模式*/ 8 .demo{ 9 -webkit-writing-mode: vertical-rl; /* for browsers of webkit engine */ 10 writing-mode: tb-rl; /* for ie */ 11 } 12 div { 13 width: 200px; 14 height: 200px; 15 background: red; 16 margin: auto; 17 /*当书写模式改为纵向，其计算参考便会变为父容器的高度了。设置auto或百分数都有效*/ 18 } 19 </style> 20 </head> 21 <body> 22 <div class="demo">123</div> 23 </body> 24 </html>
扫一扫
590
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
