一些css hack的写法

日期:2012-6-9 12:43:19  来源:北京网络公司  作者:商视互联  浏览:   [ 标签:css 网页设计 ]

  1.在html的之间加入
  在IE8 下和IE7下显示内容相同,这样我们只需区分IE6、IE7、火狐(firefox)的css hack即可
  2.注:IE都能识别*;标准浏览器(如FF)不能识别*;
  IE6能识别*,但不能识别 !important,
  IE7能识别*,也能识别!important;
  FF不能识别*,但能识别!important;以下是各浏览器CSS hack表格
  另外再补充一个,下划线"_",
  IE6支持下划线,IE7和firefox均不支持下划线。
  于是大家还可以这样来区分IE6,IE7,firefox: background:orange;*background:green;、_background:blue;
  注:不管是什么方法,书写的顺序都是firefox的写在前面,IE7的写在中间,IE6的写在最后面。
  以上是介绍区别各浏览器的CSS hack的写法,下面我们简单介绍这些CSS hack用法:
  要求说明:假如我们设置一个类名为exple的类CSS属性,CSS样式边框为1PX黑色边框,高度为100PX
  并要求,在IE6浏览器下宽度为100PX;IE7浏览器宽度下为150PX;火狐IE8谷歌浏览器下宽度为200PX;
  (PX是长度单位像素)
  则CSS代码如下:
  .exple{border:1px solid #000; height:100px;width:200px; *width:150px !important;
  *width100px;}
  这样只要在html设置一个div的类(class="exple"),这样这部分在火狐、IE8、谷歌浏览器下就会
  显示宽度为200px高度为100px带1px的黑边框的方块;IE7浏览器宽度下为150PX高度为100px带1px
  的黑边框的方块;在IE6浏览器下就会显示出长度和宽度为100px的带1px黑边的正方形。