最近做项目调试IE9的兼容性，遇到问题，样式应用不上去，在其他浏览器中是正常的。

经过查找，判定是IE9的css截断问题。

1. IE9截断判定方法

1. 打开IE Developer Tools，在网络面板，进行捕获，抓取到的css文件是完整的
2. 打开IE Developer Tools的HTML面板，在右侧样式面板中，点击最右侧对应的该css文件，
或者在css面板中选择该css文件，将滚动条拉到底，可以看到css文本是否解析完整

2. IE9截断文件大小

这个没有明确的标准。

一个说法是单个css文件不能超过250k。
一个说法是单个css文件不能超过4000+ selectors。

所以尽量将单个css文件大小控制在200K以内，应该没问题。

3. webpack的css文件分拆

使用css-split-webpack-plugin插件进行文件大小分割，如果使用了OptimizeCSSAssetsPlugin插件，则要禁止其修改
@keyframes的名字。

参考：https://blog.csdn.net/napoleonxxx/article/details/80292006
　　   https://segmentfault.com/a/1190000005966818

IE9的大css文件截断问题的更多相关文章

  1. IE9以上 CSS文件因Mime类型不匹配而被忽略 其他浏览器及IE8以下显示正常

     什么是Mime类型? MIME(Multipurpose Internet Mail Extensions)多用途互联网邮件扩展类型就是设定某种扩展名的文件用一种应用程序来打开的方式类型,当该扩展名 ...

  2. [文章存档]Azure .net WebAPP的js/css文件过大导致访问慢的解决办法

    https://docs.azure.cn/zh-cn/articles/azure-operations-guide/app-service-web/aog-app-service-web-qa-j ...

  3. js或css文件后面的参数是什么意思？

    经常看到不少导航网站测样式或js文件后面加了一些参数,主要是一你为一些并不经常更新的页面重新加载新修改的文件. 经常遇到页面里加载的js与css文件带有参数,比如: <script type=& ...

  4. js 根据屏幕大小调用不同的css文件

    原因:屏幕大小不一样,网站看起来总觉得怪怪的,所以,针对不同大小的屏幕,写了不同的css,写完了,要解决的问题就是:怎么根据屏幕的大小来引用不同的CSS,下面就是解决方法了. 解决方法:首先,在hea ...

  5. 根据浏览器显示界面大小变换，替换css文件方法

    在1024屏幕下,选择适配1024屏幕的css文件, 在大于1024屏幕下,选择适配大屏幕的css文件. 在html中的head标签中引用css文件时,加入media属性. 例: <link r ...

  6. iOS之在webView中引入本地html,image,js,css文件的方法 - sky//////////////////////////////////////ZZZZZZZZZZZZZZZ

    iOS之在webView中引入本地html,image,js,css文件的方法   2014-12-08 20:00:16CSDN-sky_2016-点击数:10292     项目需求 最近开发的项 ...

  7. html引入css文件

    在HTML中,引入CSS的方法主要有行内式.内嵌式.导入式和链接式. 行内式:即在标记的style属性中设定CSS样式,这种方式本质上没有体现出CSS的优势,因此不推荐使用.例: <html&g ...

  8. 怎样将多个CSS文件导入一个CSS文件中

    问题: 在HTML中引入css的其中的两个方法:    导入式和链接式的目的都是将一个独立的css文件引入一个文件中,二者的区别不大,事实上,二者最大的区别在于链接式使用html的标记引入外部css文 ...

  9. js或css文件合并的三种方式推荐

    源文档 <http://www.jb51.net/article/32834.htm> 在Web项目的开发中,js,css文件会随着项目的开发变得越来越多,越来越大,这就给给性能方面带来一 ...

随机推荐

  1. HTMLTestRunner.py（Python3）

    """A TestRunner for use with the Python unit testing framework. Itgenerates a HTML re ...

  2. TPO-12 C2 A problem of the TA's payroll

    TPO-12 C2 A problem of the TA's payroll payroll n. 工资单:在册职工人数:工资名单: paycheck n. 付薪水的支票,薪水 paperwork ...

  3. 【转】cocos2dx3.2学习笔记之Director（导演类）

    转载:https://blog.csdn.net/u013435551/article/details/38579747 在Cocos2d-x中,把统筹游戏大局的类抽象为导演类(Director),D ...

  4. [SHELL]结构化命令之条件语句

    1.if-then语句  #!/bin/bash username="root" if grep $username /etc/passwd then echo "the ...

  5. 【shell 练习1】编写Shell条件句练习

    实例一.比较两个整数大小 #!/bin/bash while true do read -p "Please input two int nums:" a b >/dev/& ...

  6. Apache——SSL协议

    SSL 协议既用到了公钥加密技术又用到了对称加密技术,对称加密技术虽然比公钥加密技术的速度快,可是公钥加密技术提供了更好的身份认证技术.SSL 的握手协议非常有效的让客户和服务器之间完成相互之间的身份 ...

  7. Python3 Tkinter-Text

    1.创建 from tkinter import * root=Tk() t=Text(root) t.pack() root.mainloop() 2.添加文本 from tkinter impor ...

  8. H5页面 绝对定位元素被 软键盘弹出时顶起

    H5页面 绝对定位元素被 软键盘弹出时顶起 在h5页面开发的过程中,我们可能会遇到下面这个问题,当页面中有输入框的时候,系统自带的软盘会把按钮挤出原来的位置.那么我们该怎么解决呢?下面列出一下的方法: ...

  9. location 匹配规则 （NGINX）

    转:https://moonbingbing.gitbooks.io/openresty-best-practices/ngx/nginx_local_pcre.html location 匹配规则 ...

  10. this指针与const成员函数

    this指针的类型为:classType *const      // 即指向类类型非常量版本的常量指针 所以,我们不能把this绑定到一个常量对象上 ===>  不能在一个常量对象上调用普通的 ...