31. css hack

最新推荐文章于 2024-06-04 18:04:50 发布

小狗爱吃土豆儿~

最新推荐文章于 2024-06-04 18:04:50 发布

阅读量93

点赞数

文章标签： css 前端

本文链接：https://blog.csdn.net/weixin_53971197/article/details/132292429

版权

css hack

由于不同的浏览器厂商，比如ie，火狐，谷歌，safari(苹果) 等，他们生产浏览器的时候，会有不同的渲染解决方案。还有不同版本的浏览器也可能对相同的css设置渲染不同的效果，例如 IE 6 7 8 9。css hack 是浏览器厂家给自己的浏览器专门制定的一套特殊的css兼容问题，当然也可以使用 css hack 为不同的浏览器制定不同的css

ie 的条件注释

[if IE] 只要是ie浏览器都可以生效
[if lte IE 6] 浏览器的版本小于等于ie6的时候生效
[if lt IE 6] 浏览器的版本小于ie6的时候生效
[if gte IE 6] 浏览器的版本大于等于ie6的时候生效
[if gt IE 6] 浏览器的版本大于ie6的时候生效
[if IE 6] 浏览器的版本等于ie6的时候生效
[endif] 条件注释的结束指令
[if ! IE 6] 浏览器的版本不是ie6的时候生效

特殊符号 hack

*在IE10 及其以上生效
-减号，只对 IE6 生效
+加号，只对 IE7 生效
_ 下划线，对 ie6 ie7 生效
\9 对IE6 7 8 9 10都生效
\0 对IE8 9 10都生效
\9\0 只对 IE9 10生效

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>css的hack</title>
    <link rel="stylesheet" href="../hack.css">
    <style>
        *{
            padding: 0;
            margin: 0;
        }
        .wp{
            width: 200px;
            height: 200px;
            /* *background: #f00; */
            background: #04be02;
        }
    </style>
    <!--[if lte IE9]>
        <style>
            .wp{
                background:#04be02;
            }
        </style>
    <![endif]-->
      <!--[if lte IE8]>
        <style>
            .wp{
                background:#ff0;
            }
        </style>
    <![endif]-->
</head>

小狗爱吃土豆儿~

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
31. css hack

由于不同的浏览器厂商，比如ie，火狐，谷歌，safari(苹果) 等，他们生产浏览器的时候，会有不同的渲染解决方案。还有不同版本的浏览器也可能对相同的css设置渲染不同的效果，例如 IE 6 7 8 9。css hack 是浏览器厂家给自己的浏览器专门制定的一套特殊的css兼容问题，当然也可以使用 css hack 为不同的浏览器制定不同的css。
复制链接

扫一扫