css writing-mode 手机上文字竖向排版不生效的问题
微wx笑
2022-06-13【运维日志】
249
3
0关键字：
css
通过以下样式设置文字竖向排版，在电脑上显示正常，但是在手机上不管是微信中，还是浏览器中，都不生效的解决方法
writing-mode: vertical-lr; -webkit-writing-mode: vertical-lr; -ms-writing-mode: vertical-lr;
通过以下样式设置文字竖向排版，在电脑上显示正常，但是在手机上不管是微信中，还是浏览器中，都不生效的解决方法
writing-mode: vertical-lr; -webkit-writing-mode: vertical-lr; -ms-writing-mode: vertical-lr;
产生这个问题的原因
直接在td上添加以上样式
1 | <td style="writing-mode: vertical-lr; -webkit-writing-mode: vertical-lr; -ms-writing-mode: vertical-lr;">文字竖向排版</td> |
这样子在电脑上显示就是正常的，手机上就不行。
解决的方法：
再加一层 span 标签
1 | <td style="writing-mode: vertical-lr; -webkit-writing-mode: vertical-lr; -ms-writing-mode: vertical-lr;"><span style="writing-mode: vertical-lr; -webkit-writing-mode: vertical-lr; -ms-writing-mode: vertical-lr;">文字竖向排版</span></td> |
本文由 微wx笑 创作，采用 署名-非商业性使用-相同方式共享 4.0 许可协议，转载请附上原文出处链接及本声明。
原文链接：https://www.ivu4e.cn/blog/service/2022-06-13/1238.html
