css设置文字竖版排列,并且垂直居中

作者:滴水穿石 | 创建时间: 2023-07-21
通过设置css,使文字竖版排列,并且垂直居中...
css设置文字竖版排列,并且垂直居中

操作方法

初始设置一个父div的宽度和高度,为了方便查看,设置背景色为红色 有个子div显示文本,希望该文本在父div中竖版排列,并且垂直居中

这里设置writing-mode属性,实现文字竖版显示

这里设置writing-mode为vertical-lr

设置文本居中可以设置text-align:center; 因为要在父div中居中,需要设置子div的高度等于父div

文字已经竖型排版,并且垂直居中。但是文字间距比较小 可以通过设置letter-spacing来修改文字间距

最终效果如下

点击展开全文

更多推荐