css实现文本从上到下

eg:

<!DOCTYPE html >
<html>
<head>
    <meta charset="utf-8" />
    <title>test</title>
    <style >
        .box{
            writing-mode: tb-rl;/*决定文字排版方向*/
            width: 120px; 
            height: 100px; 
            margin:163.65px 0 0 23.35px; 
            padding: 3px; 
            border: 1pt solid #000000; 
            word-wrap: break-word;            
        }
    </style>
</head>
<body>
    <div  class="box">
        测试一下文字的排版样式
    </div>
</body>
</html>

实现文字排版从上到下，需在css中添加下面这个样式：

语法：  writing-mode : lr-tb | tb-rl
lr-tb 左-右，上-下
tb-rl 上-下，右-左

 

posted @ 2022-07-27 15:27  阳光下的向日葵  阅读(1120)  评论(0)    收藏  举报