做前端设计的人经常要接触CSS方面的问题,估计有不少人会遇到Chrome谷歌浏览器中CSS设置字体小于12px显示不正常,强创网络在做magento模板过程中就遇到了,起初以为是自己写的CSS的问题,后面一步步排查出来,在Chrome谷歌浏览器中确实不支持CSS设置字体小于12px,那我们要如何解决Chrome谷歌浏览器不支持CSS小于12px文字的问题呢? 今天强创网络来讲下具体方法。
Chrome谷歌浏览器是Webkit的内核,有一个 -webkit-text-size-adjust 的私有 CSS 属性,通过它即可实现字体大小不随终端设备或浏览器影响。
CSS样式定义如下:
-webkit-text-size-adjust:none;
使用这个CSS属性可以解决问题。
如:div { -webkit-text-size-adjust:none;font-size:10px }
这里要声明一点,使用了这个属性后,Chrome下字体就不支持放大、缩小功能了哦。。。这个影响也不大,一般很少人用放大,缩小功能。
以上解决办法来自网络,经过了半小时,关于谷歌浏览器显示CSS样式设置字体大小问题终于解决了,这样其他浏览器也不会因为此CSS样式属性而受影响。

解决CSS小于12px的文字在谷歌浏览器显示问题的更多相关文章

  1. 解决Chrome谷歌浏览器不支持CSS设置小于12px的文字

    在最新版的谷歌里.已经不在支持这个属性啦 谷歌浏览器Chrome是Webkit的内核,有一个 -webkit-text-size-adjust 的私有 CSS 属性,通过它即 可实现字体大小不随终端设 ...

  2. 【css】怎么让Chrome支持小于12px 的文字

    谷歌浏览器Chrome是Webkit的内核,有一个 -webkit-text-size-adjust 的私有 CSS 属性,通过它即可实现字体大小不随终端设备或浏览器影响.CSS样式定义如下:-web ...

  3. 使用css怎么让谷歌支持小于12px的文字比如10px

    1.小于12px的字体,如果内容固定,可以将内容切除做图片,没有兼容问题. 2.-webkit-text-size-adjust:none;老版本谷歌,27版本之后无用 3.-webkit-trans ...

  4. 彻底解决WP的TextBox中文字过长显示不出来的问题

    文字如果过长的话在TextBox中会显示不完全,这个大家都知道了,后来有人做了ExTextblock增强控件,大部分文字是可以显示出来了,不过,在某些情况下还是会有显示不全的情况. 这个时候一个解决方 ...

  5. css如何简单设置文字溢出盒子显示省略号

    1.单行文本溢出显示省略号单行文本溢出显示省略号,必须满足三个条件:(1)先强制一行内显示文本white-space:nowrap;(默认 normal自动换行)(2)超出的部分隐藏overflow: ...

  6. 完美解决移动Web小于12px文字居中的问题

    前几天的一篇博文:移动Web单行文字垂直居中的问题,提到了移动web里小于12px的文字居中异常的问题,最后还是改为12px才近乎解决了问题.但是有时候或许并不是那么乐观,你并不能将原本定为10px的 ...

  7. Chrome谷歌浏览器下不支持css字体小于12px的解决办法

    先来看下 ie.火狐.谷歌浏览器下各个字体显示情况 ie下: 火狐下: 谷歌下: 从上面的图可以很明显看出谷歌下 css设置字体大小为12px及以下时,显示都是一样大小,都是默认12px; 那么网上一 ...

  8. [Chrome](CSS) 解决Chrome font-size 小于 12px 无效

    Chrome中 font-size 小于 12px 会失效. 解决的办法一种是: -webkit-text-size-adjust:none; (但是Chrome27之后取消了支持) 利用CSS3的缩 ...

  9. Chrome不支持css字体小于12px的解决办法

    我们先来看个效果图(chrome下): 从上面的图可以很明显地看出Chrome下css设置字体大小为12px及以下时,显示的都是一样大小,都是默认12px: 那么网上有一个方法就是给当前样式添加Chr ...

随机推荐

  1. Lambda表达式与Function接口

    Lambda表达式是一个匿名函数.C++ 11和 java 8 相继引入了有关对Lambda表达式的支持. Lambda表达式对于高级语言而言并不是必要的,对于Java而言它的功能和一个简易的接口差不 ...

  2. AngularJS开发经验(转)

    AngularJS是为了克服HTML在构建应用上的不足而设计的.HTML是一门很好的为静态文本展示设计的声明式语言,但要构建WEB应用的话它就显得乏力了.所以我做了一些工作(你也可以觉得是小花招)来让 ...

  3. 对于transform的新认识

    transform-origin是作用于该元素自己的,transform-origin(0px,0px),是以该元素自己本身的左上角(0px,0px)为圆心进行动作的.

  4. 管理工具MongoVUE使用

    连接数据库 管理数据库 查询 1,查询所有 2,查询命令窗口

  5. java 面向对象编程-- 第15章 集合框架

    1.  集合特点:元素类型不同.集合长度可变.空间不固定 2.  java中对一些数据结构和算法进行了封装即集合.集合也是一种对象,用于存储.检索.操作和传输对象. 3.  JCF(Java Coll ...

  6. 使用WebView视图显示网页-----迷你浏览器

    Android提供了WebView组件,表面上来看,这个组件与普通ImageView差不多,但实际上,这个组件的功能要强大得多,WebView组件本身就是一个浏览器实现,它的内核基于开源WebKit引 ...

  7. [示例]创建Student类,输入学生信息并存入字典,将3个存有学生信息的字典存入数组,并计算

    代码: main: #import <Foundation/Foundation.h> #import "Student.h" int main(int argc, c ...

  8. 统计sql语句执行效率

    --统计sql语句执行效率SELECT (total_elapsed_time / execution_count)/1000 N'平均时间ms' ,total_elapsed_time/1000 N ...

  9. 可滑动的ToggleButton(开关)

    2013-12-28 17:25:01 网上看到一篇关于可滑动的ToogleButton的文章,有代码,觉得挺好,但是不符合我的要求,因此在他的代码基础上改了一些.(作者看到了勿喷啊,实在找不到原文了 ...

  10. Deep Learning 初识

    实际生活中,人们为了解决一个问题,如对象的分类(对象可是是文档.图像等),首先必须做的事情是如何来表达一个对象,即必须抽取一些特征来表示一个对象,如文本的处理中,常常用词**来表示一个文档,或把文档表 ...