css文字垂直排列方式 css文字竖直显示的代码 _生活百科

CSS实现文字竖向排版的简单方法， bootstrap4文字竖向排版代码：
主要用到的CSS属性：writing-mode: vertical-lr;及writing-mode: tb-lr;/*IE浏览器*/ ，英文字符加上这句：word-wrap: break-word;/*英文的时候需要加上这句，自动换行*/
效果图：

文章插图
代码如下：
【css文字垂直排列方式 css文字竖直显示的代码】

<style>.text-vertical {margin: 0 auto;height: 140px;writing-mode: vertical-lr;/*从左向右 从右向左是 writing-mode: vertical-rl;*/writing-mode: tb-lr;/*IE浏览器的从左向右 从右向左是 writing-mode: tb-rl；*/word-wrap: break-word;/*英文的时候需要加上这句，自动换行*/}</style><!-- 这首诗要转载，请注明来自：www.df81.com --> <div class="text-vertical">远看代码黑乎乎，上头密来下头疏 。若把电脑倒过来，下头密来上头疏 。</div><div class="text-vertical">www.df81.com</div>

以上关于本文的内容，仅作参考！温馨提示：如遇健康、疾病相关的问题，请您及时就医或请专业人士给予相关指导!

「四川龙网」www.sichuanlong.com小编还为您精选了以下内容，希望对您有所帮助：