炫意html5
最早CSS3和HTML5移动技术网站之一

chrome和百度浏览器CSS字体大小小于12px不起作用解决方法和根本原因

chrome和百度浏览器CSS字体大小小于12px不起作用的根本原因是,百度浏览器和chrome用的是webkit内核,而webkit默认支持最小字号为12px。

那么,如何解决CSS字体小于12px不起作用的问题?取消这个限制就行了,加入以下代码:

-webkit-text-size-adjust:none;/*就是取消字号限制的*/

现在就可以设置小于12px的css字体样式了:

font-size:10px;

高版本chrome谷歌浏览器不再支持小于12px的字体:
高版本chrome谷歌浏览器已经不再支持-webkit-text-size-adjust样式也就是不在支持小于12px以下字体,所以要使用时候慎用。为了兼容各大浏览器最好最小文字字体大小设置12px及12px以上。

建议:

1、用图片:如果是内容固定不变情况下,使用将小于12px文字内容切出做图片,这样不影响兼容也不影响美观。
2、使用12px及12px以上字体大小:为了兼容各大主流浏览器,建议设计美工图时候设置大于或等于12px的字体大小,如果是接单的这个时候就需要给客户讲解小于12px浏览器不兼容等事宜。
3、继续使用小于12px字体大小样式设置:如果不考虑chrome可以不用考虑兼容,同时在设置小于12px对象设置-webkit-text-size-adjust:none,做到最大兼容考虑。
4、使用12px以上字体:为了兼容、为了代码更简单 从新考虑权重下兼容性。

以上就是chrome和百度浏览器CSS字体大小小于12px不起作用解决方法和根本原因,欢迎指正,希望对你有帮助,谢谢!

炫意HTML5 » chrome和百度浏览器CSS字体大小小于12px不起作用解决方法和根本原因

CSS3教程HTML5教程