位置:- 正文

css文字垂直展示的方法(css怎么让文字垂直居中显示)

编辑:rootadmin
一、使用writing-mode(推荐使用) writing-mode:翻译过来是“写字 — 模式”,文本在水平或垂直方向上如何排布 有以下几个属性值: horizontal-tb: 水平展示,也就是横着展示文字,最平常默认的样式 vertical-rl:垂直展示,也就是上面图片上实现的样式 ver ... 一、使用writing-mode(推荐使用)

推荐整理分享css文字垂直展示的方法(css怎么让文字垂直居中显示),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:css文字垂直居中怎么设置,css中文字垂直排列,css文字垂直居中怎么设置,css文字垂直显示,css文字垂直对齐方式,css中文字垂直排列,css文字垂直显示,css文字垂直对齐方式,内容如对您有帮助,希望把文章链接给更多的朋友!

  writing-mode:翻译过来是“写字 — 模式”,文本在水平或垂直方向上如何排布

  有以下几个属性值:horizontal-tb: 水平展示,也就是横着展示文字,最平常默认的样式vertical-rl:垂直展示,也就是上面图片上实现的样式vertical-lr:垂直展示,根据内容从上到下排列,和上面的属性一般是兼容替换sideways-rl:根据内容垂直方向从上到下排列sideways-lr: 根据内容垂直方向从下到上排列,和上面的属性一般是兼容替换

  

  举个栗子:

  writing-mode: vertical-lr;/*垂直展示*/

  writing-mode: tb-lr;/*兼容IE*/

css文字垂直展示的方法(css怎么让文字垂直居中显示)

  注意:

  如果需要调节字与字之间的距离时候,line-height 是无效的,需要用letter-spacing 这个改变字间距

二、设定宽度,让文字挤出去不得不换行(推荐使用)

  

  

  这里的宽度只有50px,文字内容太多只能换行展示

三、使用br换行(不推荐使用)

  举个栗子:

  

  这样比较麻烦,而且如果是动态数据就很麻烦,总不能在拿到数据后循环在每个字后面加br实现吧!

  

本文链接地址:https://www.jiuchutong.com/zhishi/303168.html 转载请保留说明!
下一篇链接:https://www.jiuchutong.com/zhishi/303169.html
免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

鄂ICP备2023003026号

友情链接: 武汉网站建设 电脑维修 湖南楚通运网络