700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > css实现文字纵向排版并且水平垂直居中

css实现文字纵向排版并且水平垂直居中

时间:2018-08-12 17:33:40

相关推荐

css实现文字纵向排版并且水平垂直居中

第一种方法:CSS属性write-mode实现文字竖排

.wordWrapClass{word-wrap: break-word;/*英文的时候需要加上这句,自动换行*/ /*自测了这句话没啥用*/writing-mode: vertical-rl;/*从左向右 从右向左是 writing-mode: vertical-rl;*/ writing-mode: tb-rl;/*IE浏览器的从左向右 从右向左是 writing-mode: tb-rl;*/ text-align: center;padding:0px; display:flex;-webkit-display:flex;flex-direction:column; /* align-content: center; *//* vertical-align: middle; */justify-content:center;}

第二种方法:css属性transform:rotate实现文字竖排

-webkit-transform: rotate(90deg);

这个自己试一下好啦,我用得第一种方法比较好

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。