CSS里文字怎么纵向排列？文字怎么竖排？下面本篇文章就来给大家介绍使用CSS让文字纵向排列的方法。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。
在CSS中，可以使用writing-mode属性来让让文字纵向排列。
writing-mode 属性定义了文本在水平或垂直方向上如何排布。
语法：
writing-mode: horizontal-tb | vertical-rl | vertical-lr | sideways-rl | sideways-lr | lr-tb | tb-rl
属性值：
-
horizontal-tb：水平方向自上而下的书写方式。即 left-right-top-bottom
-
vertical-rl：垂直方向自右而左的书写方式。即 top-bottom-right-left
-
vertical-lr：垂直方向内内容从上到下，水平方向从左到右
-
sideways-rl：内容垂直方向从上到下排列
-
sideways-lr：内容垂直方向从下到上排列
-
lr-tb：左-右，上-下。对象中的内容在水平方向上从左向右流入，后一行在前一行的下面。 所有的字形都是竖直向上的。这种布局是罗马语系使用的（IE）
-
tb-rl：上-下，右-左。对象中的内容在垂直方向上从上向下流入，自右向左。后一竖行在前一竖行的左面。全角字符是竖直向上的，半角字符如拉丁字母或片假名顺时针旋转90度。这种布局是东亚语系通常使用的（IE）
示例：
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<meta charset="UTF-8">
</head>
<style>
.one {
margin: 0 auto;
height: 140px;
writing-mode: vertical-lr;/*从左向右 从右向左是 writing-mode: vertical-rl;*/
writing-mode: tb-lr;/*IE浏览器的从左向右 从右向左是 writing-mode: tb-rl；*/
}
</style>
<body>
<div class="one">十轮霜影转庭梧，此夕羁人独向隅。
未必素娥无怅恨，玉蟾清冷桂花孤。 </div>
</body>
</html>
效果图：
