博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
浏览器兼容
阅读量:6595 次
发布时间:2019-06-24

本文共 2166 字,大约阅读时间需要 7 分钟。

/* IE8-11,Firefox,Chrome,Opera,Safari */

/* 除了Opera 未鉴定,其他已鉴定*/

IE6 css hack:

1. *html Selector {} /* Selector 表示 css选择器 下同 */2. Selector { _property: value; } /* property: value 表示 css 的属性名: 属性值 下同 */3. Selector { _property/**/: /**/value; }4. Selector { -property: value; } /*IE6 css hack常用习惯推荐使用下划线_ */

IE7 css hack:

1. *+html Selector {}2. *:first-child+html Selector {}

IE8 css hack:

Selector { /* 注意看value值的 */    property: value1; /* W3C MODEL */    property: value2\0; /* IE 8+ */    property: value1\9\0; /* IE 9+ */}

IE6、IE7、IE8共有的css hack:

Selector { property: value\9; }

IE6、IE7共有的css hack:

1. Selector { *property: value; }2. Selector { #property: value; }3. Selector { +property: value; }

IE8+ css hack:

Selector { property: value\0; }

IE9+ css hack:

Selector { property: value\9\0; }

单独区分IE8 和IE9

 

.Selector{margin-left:-2px\0}【ie8和ie9均可识别\0】:root .Selector{margin-left:0\9}【只有ie9可识别:root】

 

判断方式:

<!–[if !IE]><!–> 除IE外都可识别 <!–<![endif]–>
<!–[if IE]> 所有的IE可识别 <![endif]–>
<!–[if IE 6]> 仅IE6可识别 <![endif]–>
<!–[if lt IE 6]> IE6以及IE6以下版本可识别 <![endif]–>
<!–[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]–>
<!–[if IE 7]> 仅IE7可识别 <![endif]–>
<!–[if lt IE 7]> IE7以及IE7以下版本可识别 <![endif]–>
<!–[if gte IE 7]> IE7以及IE7以上版本可识别 <![endif]–>
<!–[if IE 8]> 仅IE8可识别 <![endif]–>
<!–[if IE 9]> 仅IE9可识别 <![endif]–>

/* IE9+, Chrome, opera */
@media all and (min-width:0) {
    
}
/* :root 为ie9 专用
例如>:root .name{ height:15px\9;}
属性值后面加\9
*/
:root .name{ height:15px\9;}
/* IE8 专用  */
@media \0screen {   
    .name {
        height: 55px;
    }
}
/* IE10+ 识别  
10 和  11 区分
例如>.name { height: 45px\9; } 10识别,11不认
*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .name {
        height: 45px;
        height: 55px\9;
    }
}

/* firefox 识别     */

@-moz-document url-prefix(){
    .name{
        height: 28px;
        line-height: 20px;
    }    
}
/* Chrome 和 Safari (Webkit内核) */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .name{
        height: 70px;
    }
}
/* opera 识别
简述:opera内核为:Presto,目前新版 opera 内核转为webkit
该hack 还没验证是否好使
*/
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0)    
{
    head~body  .name { height:150px; }
}

【个人整理】

转载于:https://www.cnblogs.com/Zhangyuxiang/p/5328795.html

你可能感兴趣的文章
一行命令获取当前JVM所有可设置的参数以及当前默认值
查看>>
Linux mint 14下的powerDNS+mysql+powerAdmin搭建个性DNS域名解析服务器
查看>>
Red Hat EnterPrise Linux 5.4下web服务器的综合使用(普通站点、虚拟主机、安全性、...
查看>>
unbantu安装 mysql --- 百度云
查看>>
JS中的默认行为
查看>>
从oracle到mysql,主从到分库,一个普通项目数据库架构的变迁
查看>>
selenium层级定位及鼠标键盘操作
查看>>
SpringBoot跨域问题解决方案
查看>>
(转载)hibernate3.0配置文件模板
查看>>
46、练习:输出指定目录下的所有文件名称
查看>>
IP地址与数字地址相互转换
查看>>
字符串连接[不用库函数]
查看>>
新建一个express工程,node app无反应
查看>>
OCM_第十一天课程:Section5 —》数据仓库
查看>>
水晶报表
查看>>
cogs 539. 牛棚的灯
查看>>
SQL SERVER 备份数据库到指定路径语句
查看>>
3.Knockout.Js(属性绑定)
查看>>
v140平台工具集与v110工具集选择
查看>>
SQL SERVER 2012 只能识别20个CPU的问题
查看>>