CSS hack就是为了让你的CSS代码兼容不同的浏览器,其中最难对付的就是IE浏览器的兼容性,因为它的版本很多,不过还好,微软发表声明已经不对IE8以下的版本进行维护了。但是我们也不能就认为不用学IE8之前版本的兼容性了。反过来,如果我想在IE浏览器中让元素表现出另外一种样式,我也可以通过CSS hack来实现,所以这招人烦的IE兼容性也可以为自己所用。总之,多学点没有坏处。

CSS hack通常分为 条件Hack、属性hack、选择符hack。下面一一来介绍:

1、条件hack::

表现形式:

  <!--[if  lte  IE 6]>

      <style  type="text/css">

          div{color:red;}

      </style>

     <![endif]-->.

这是一个选择语句,只不过是在特定浏览器下执行。这个语句表明在IE6及6以下版本的IE浏览器中,div中字体的颜色是红色。其中lte表示 Less than or equal to(小于或等于)的简写。既然有小于等于那也可能会有greater or equal to大于等于(gte),gt(大于);lt(小于);如果我想表示样式只对某个版本的IE浏览器才有效,这个语句又该怎么写呢?下面这个语句表明只有在IE8版本的IE浏览器下,div的背景颜色为#ccc;

<!--[if  IE 8]>

    <style   type="text/css">

        div{background:#ccc;}

     </style>

<![endif]-->

那如果我想表示除了某个版本IE浏览器,其余的浏览器都能表现这个样式又该怎么写呢?

<!--[if ! IE 8]>

  <style  type="text/css">

      div{box-sizing:content-box;}

  <style>

<![endif]-->

表明除了IE8之外的所有IE浏览器中,div所占页面的实际尺寸的计算是content+padding*2+border*2;

2、属性hack::

属性hack是指通过只有自己才能识别的出的符号添加在属性的前面,比如,

IE都能识别*  标准浏览器(例如火狐)不能识别*
IE6能识别*,但不能识别  !important
IE7能识别*,也能识别 !important
火狐不能识别*,但能识别!important

只有IE6能识别下划线“_”;

只有IE7能识别 *+

element{_color:#f7f7f7f;}只有IE6能识别,所以在IE6中字体颜色为#f7f7f7;

element{*color:#f7f7f7;}IE6和IE7都能识别;

element{color:red !important;}IE7和火狐浏览器能识别;

3、选择符hack

*+element{color:red;}只有IE7才能识别;

<!--[if IE]><style></style><![endif]-->的更多相关文章

  1. 简单物联网:外网访问内网路由器下树莓派Flask服务器

    最近做一个小东西,大概过程就是想在教室,宿舍控制实验室的一些设备. 已经在树莓上搭了一个轻量的flask服务器,在实验室的路由器下,任何设备都是可以访问的:但是有一些限制条件,比如我想在宿舍控制我种花 ...

  2. 利用ssh反向代理以及autossh实现从外网连接内网服务器

    前言 最近遇到这样一个问题,我在实验室架设了一台服务器,给师弟或者小伙伴练习Linux用,然后平时在实验室这边直接连接是没有问题的,都是内网嘛.但是回到宿舍问题出来了,使用校园网的童鞋还是能连接上,使 ...

  3. 外网访问内网Docker容器

    外网访问内网Docker容器 本地安装了Docker容器,只能在局域网内访问,怎样从外网也能访问本地Docker容器? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Docker容器 ...

  4. 外网访问内网SpringBoot

    外网访问内网SpringBoot 本地安装了SpringBoot,只能在局域网内访问,怎样从外网也能访问本地SpringBoot? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装Java 1 ...

  5. 外网访问内网Elasticsearch WEB

    外网访问内网Elasticsearch WEB 本地安装了Elasticsearch,只能在局域网内访问其WEB,怎样从外网也能访问本地Elasticsearch? 本文将介绍具体的实现步骤. 1. ...

  6. 怎样从外网访问内网Rails

    外网访问内网Rails 本地安装了Rails,只能在局域网内访问,怎样从外网也能访问本地Rails? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Rails 默认安装的Rails端口 ...

  7. 怎样从外网访问内网Memcached数据库

    外网访问内网Memcached数据库 本地安装了Memcached数据库,只能在局域网内访问,怎样从外网也能访问本地Memcached数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装 ...

  8. 怎样从外网访问内网CouchDB数据库

    外网访问内网CouchDB数据库 本地安装了CouchDB数据库,只能在局域网内访问,怎样从外网也能访问本地CouchDB数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Cou ...

  9. 怎样从外网访问内网DB2数据库

    外网访问内网DB2数据库 本地安装了DB2数据库,只能在局域网内访问,怎样从外网也能访问本地DB2数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动DB2数据库 默认安装的DB2 ...

  10. 怎样从外网访问内网OpenLDAP数据库

    外网访问内网OpenLDAP数据库 本地安装了OpenLDAP数据库,只能在局域网内访问,怎样从外网也能访问本地OpenLDAP数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动 ...

随机推荐

  1. 【架构】从instagram学习最小化IT是怎么做的

    Keep it very simple (极简主义) Don't re-invent the wheel (不重复发明轮子) Go with proven and solid technologies ...

  2. laravel 框架登录 参考

    一.登录功能1.书写登录路由Route::view('login','login');2.书写登录页面  视图层<form action="{{route('loginDo')}}&q ...

  3. promise 理解与总结

    对Promise的理解 Promise是异步编程的一种解决方案,可以获取异步操作的消息,避免了地狱回调,它比传统的解决方案回调函数和事件更合理和更强大. 所谓Promise,简单说就是一个容器,里面保 ...

  4. LGP4451题解

    题意明确,不再阐述( 首先,众所周知的是 斐波那契数列 的生成函数是 \(F(x)=\frac x {1-x-x^2}\) 那么答案就是 \(\sum_{i=0} F^i(x) = \frac 1 { ...

  5. 移动端ios网页版收起键盘导致页面空白解决办法

    失焦的时候把窗口滚动位置设置到(0,0)就行了 <input type="text" onblur="window.scrollTo(0, 0);"> ...

  6. 基于selenium实现河海大学自动健康打卡

    0.每日健康打卡有点烦 1.所用方法:selenium:需要下载响应浏览器的webdriver 2.注意事项,我感觉唯一要注意的就是页面跳转以后应该怎么操作了(那个时候困扰了我好几天) 3.相应代码: ...

  7. mybatis的几种like查询

    oracle数据库: Java代码 SELECT * FROM user WHERE name like CONCAT('%',#{name},'%') 或 Java代码 SELECT * FROM ...

  8. Java基础—字符串的比较

    1."=="方法进行比较时有以下两种情况: 基础数据类型:比较的是数据值是否相同 引用类型:比较的是地址值是否相同 字符串是对象,它比较内容是通过一个方法实现的,equals() ...

  9. 不借助 Docker Desktop 在Mac上开发容器应用

    镜像下载.域名解析.时间同步请点击 阿里巴巴开源镜像站 Docker Desktop是最为流行的开发者工具,Docker公司在 8/31 宣布对Docker Desktop的用户协议进行了变更,对个人 ...

  10. k8s集群Job Pod 容器可能因为多种原因失效,想要更加稳定的使用Job负载,有哪些需要注意的地方?

    k8s集群Job Pod 容器可能因为多种原因失效,想要更加稳定的使用Job负载,有哪些需要注意的地方? 面试官:"计数性Job默认完成模式是什么?Indexed模式如何发布自定义索引呢?& ...