CSS text-combine-upright 实现字符的横向合并

121 阅读1分钟

①垂直排版:writing-mode:vertical-lr,但段落中的数字会旋转 90 度;
②text-orientation:upright,数字不会旋转,但相关联的数字会拆分,不符合阅读习惯;
③text-orientation 属性可以让垂直排版中的局部区域的文字水平排版,同时多个水平排版字符占据的宽度和一个正常的字符一样;
④text-combine-upright 支持以下属性:
none:初始值,不连续横排;
all:试图水平排版框内所有连续字符,使它们占用框垂直线内单个字符的空间;
digits[integer]:多少个连续数字认为是横着显示。默认是 2,范围不能在 2-4 之外,否则认为是不合法。也就是最多只能让一个标签内 4 个字符水平排列;
(参考:www.zhangxinxu.com/wordpress/2…