admin管理员组

文章数量:1579892

1、IE浏览器内核：Trident内核，也是俗称的IE内核；
2、Chrome浏览器内核：统称为Chromium内核或Chrome内核，以前是Webkit内核，现在是Blink内核；
3、Firefox浏览器内核：Gecko内核，俗称Firefox内核；
4、Safari浏览器内核：Webkit内核；
5、Opera浏览器内核：最初是自己的Presto内核，后来是Webkit，现在是Blink内核；

6、360浏览器、猎豹浏览器内核：IE+Chrome双内核；
7、搜狗、遨游、QQ浏览器内核：Trident（兼容模式）+Webkit（高速模式）；
8、百度浏览器、世界之窗内核：IE内核；
9、2345浏览器内核：以前是IE内核，现在也是IE+Chrome双内核；

css属性兼容

  • ， ie6,ie7可以识别；
    _和- ， ie6可以识别；
    !important ,表示高优先级，ie7及以上，firefox都支持，ie6认识带!important的样式属性，但不认识!important的优先级；
    -webkit- ，针对safari，chrome浏览器的内核CSS写法
    -moz-，针对firefox浏览器的内核CSS写法
    -ms-，针对ie内核的CSS写法
    -o-，针对Opera内核的CSS写法

举个例子border-radius
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-o-border-radius: 10px;
border-radius: 10px;

这里必须注意的是标准写法（不带前缀的）必须放在最后，否则容易造成渲染出意外的结果~

浏览器hack兼容处理
条件注释法(IE10+已经不支持条件注释)
信息提示 小于=>lt 小于等于=>lte 大于=>gt 大于等于=>gte

[1]IE9-( )

[2]仅单一IE( )

[3]( )

[4]非IE(IE10+也能识别)，此处多加的<–>，在IE中被当作内部注释，而在非IE浏览器中会闭合之前的注释( <![endif]–>)

CSS hack
【1】属性前缀法(只有IE支持)

[1]IE6-(下划线、中划线)(_color:blue;-color:blue;)

[2]IE7-(星号、加号)(*color:blue;+color:blue;)

[3]IE10-(\9)(color:blue\9;)

[4]IE8+(\0)(color:blue\0;)

[5]IE9、IE10(\9\0)(color:blue\9\0;)

【2】选择器前缀法

[1]IE6-(*html)

[2]IE7(*+html)

[3]IE8(@media \0)

[4]IE9+及其他非IE浏览器(:root)

[5]firefox(x:-moz-any-link,)

[6]chrome、safari、opera(@media screen and (-webkit-min-device-pixel-ratio:0))

《高性能网站建设指南》这本书中提出了一些规则：
规则1——减少HTTP请求
规则2——使用内容发布网络
规则3——添加Expires头
规则4——压缩组件
规则5——将样式表放在顶部
规则6——将脚本放在底部
规则7——避免CSS表达式
规则8——使用外部JavaScript和CSS
规则9——减少DNS查找
规则10——精简JavaScript
规则11——避免重定向
规则12——移除重复脚本
规则13——配置ETag
规则14——使AjaX可缓存

转载于：https://blog.csdn/qq_38948398/article/details/86132520
感谢作者的总结与分享

本文标签： 内核浏览器网站PC

版权声明：本文标题：PC端兼容和浏览器内核及网站优化 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://www.elefans.com/dianzi/1727865234a1134377.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。