vue(css)实现三个字和四个字等宽、或者3个字和2个字等宽
实现效果:在做前台界面的时候,比如一些文字的列表或者一些表单的标题,经常是2个字,3个字,4个字的类型。一般对齐就是在中间打空格或者用 来空开,但是效果并不好,兼容性有问题,造成不美观。letter-spacing 属性增加或减少字符间的空白(字符间距)。该属性定义了在文本字符框之间插入多少空间。由于字符字形通常比其字符框要窄,指定长度值时,会调整字母之间通常的间隔。代码:<div
·
效果图:
在做前台界面的时候,比如一些文字的列表或者一些表单的标题,经常是2个字,3个字,4个字的类型。
一般对齐就是在中间打空格或者用 来空开,但是效果并不好,兼容性有问题,造成不美观。
letter-spacing 属性增加或减少字符间的空白(字符间距)。
该属性定义了在文本字符框之间插入多少空间。由于字符字形通常比其字符框要窄,指定长度值时,会调整字母之间通常的间隔。
上面效果图的代码:
<div slot="label" style="font-size: 14px;letter-spacing:0.33em;">收件人:</div>
提示:具体的letter-spacing数值,请根据实际显示效果进行调整。
“em” 表示相对于font-size大小的长度。letter-spacing也可以使用"px"作为单位
更多推荐
已为社区贡献39条内容
所有评论(0)