chrome下小于12px字体

我们设置字体大小的时候,当字体小于等于12px时候,Chrome是不能显示的(难得IE下可以),因为Chrome以及Chrome内核的浏览器在中文语言下最小字体只能是12px(不知道这算是一个bug还是Chrome人性化的设计)。
解决办法:
使用CSS样式transform: scale()属性进行元素缩放,因为这个属性会将整个元素都进行缩放,所以可以使用<span></span>标签将需要设置字体大小的内容包裹起来,同时给span标签设置block属性值

span {
	display: block;
	font-size: 12px;
	-webkit-transform: scale(0.84, 0.84);
}

这样,在IE下就是正常的12px字体,Chrome下就是14px缩放了0.84倍的大小。

猜你喜欢

转载自blog.csdn.net/weixin_43443341/article/details/92783499