css中文字横排版变竖排

在网页设计中，文字排版是非常重要的一部分。一般情况下，我们习惯将中文字水平排列，以适应我们通常从左到右阅读的方法。但是，在某些情况下，比如设计竖排布局的页面，让中文字竖排排列更符合设计需求。

<style>
    /* 将文字竖排 */
    .vertical-text {
        writing-mode: vertical-rl;
        text-orientation: mixed;
    }
</style> 

要实现中文字竖排排列，需要CSS的支持。我们可以使用CSS中的writing-mode属性来改变文字排列的方向。writing-mode属性有以下几个值：

• horizontal-tb：水平从左到右排列
• vertical-rl：垂直从上到下排列（右对齐）
• vertical-lr：垂直从上到下排列（左对齐）
• sideways-rl：文字旋转90度（右对齐）
• sideways-lr：文字旋转90度（左对齐）

除了writing-mode属性，我们还可以利用text-orientation属性来控制文字排列的方向和朝向。text-orientation属性有以下两个值：

• mixed：文字排列方向垂直，但是字体朝向在水平方向
• upright：文字排列方向垂直，字体朝向也垂直

需要注意的是，一些旧版的浏览器不支持writing-mode和text-orientation属性，因此请仔细选择何时使用这些属性。

<div class="vertical-text">
  <!-- 将文字竖排 -->
  <p>这是竖排文字</p>
</div> 

以上就是如何用CSS将中文字横排版改为竖排版的方法。