文字竖排，从上到下排列，仿古文的写法-526互联

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>这里填写标题</title>
<meta name="keywords" content="这里填写关键词" />
<meta name="description" content="这里填写说明内容" />

<script language="JavaScript" type="text/javascript">
<!--JS代码位置-->
</script>

<style type="text/css">
<!--CSS样式代码位置-->
.container {
   display: inline-block;
   width: 150px; /*根据需求调整宽度*/
   height: 150px;
   overflow: hidden;
}
 
.container p {
   writing-mode: vertical-rl; /*从右向左竖排*/
  float:right;

}
</style>

</head>

<body>

这里填写HTML代码
<div class="container">
    <p>这里是竖排的文本内容</p><br>
<p>这里是竖排的文本内容1</p>
<p>这里是竖排的文本内容2</p>
<p>这里是竖排的文本内容3</p>
<p>这里是竖排的文本内容4</p>
</div>

</body>
</html>

View Code

主要是writing-mode: vertical-rl; 这样，至于从右到左是float:right;了

写法