所有浏览器 通用 height: 100px;

IE6 专用 _height: 100px;

IE7 专用 *+height: 100px;

IE6、IE7 共用 *height: 100px;

IE7、FF 共用 height: 100px !important;

例如:

#example { height:100px; } /* FF */

* html #example { height:200px; } /* IE6 */

*+html #example { height:300px; } /* IE7 */

下面的这种方法比较简单

举几个例子:

1、IE6 - IE7+FF

#example {

height:100px; /* FF+IE7 */

_height:200px; /* IE6 */

}

其实这个用上面说的第一种方法也可以

#example {

height:100px !important; /* FF+IE7 */

height:200px; /* IE6 */

}

2、IE6+IE7 - FF

#example {

height:100px; /* FF */

*height:200px; /* IE6+IE7 */

}

3、IE6+FF - IE7

#example {

height:100px; /* IE6+FF */

*+height:200px; /* IE7 */

}

4、IE6 IE7 FF 各不相同

#example {

height:100px; /* FF */

_height:200px; /* IE6 */

*+height:300px; /* IE7 */

}

或:

#example {

height:100px; /* FF */

*height:300px; /* IE7 */

_height:200px; /* IE6 */

}

需要注意的是,代码的顺序一定不能颠倒了,要不又前功尽弃了。因为浏览器在解释程序的时候,如果重名的话,会用后面的覆盖前面的,就象给变量赋值一个道理,所以我们把通用的放前面,越专用的越放后面

解释一下4的代码:

读代码的时候,第一行height:100px; 大家都通用,IE6 IE7 FF 都显示100px

到了第二行*height:300px; FF不认识这个属性,IE6 IE7都认,所以FF还显示100px,而IE6 IE7把第一行得到的height属性给覆盖了,都显示300px

到了第三行_height:200px;只有IE6认识,所以IE6就又覆盖了在第二行得到的height,最终显示200px

这样,三个浏览器都有自己的height属性了.

*+html 对IE7的兼容 必须保证HTML顶部有如下声明:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

CSS HACK的方法的更多相关文章

  1. CSS Hack技术(一)

    这世间坑爹的东西不少,浏览器可以算做一件,尤其的IE浏览器.关于浏览器的吐槽已经有不少了,我也就不在这添油加醋了.不过吐槽终究只是泄一时之愤,解决问题才是关键,今天我们就来讲一讲浏览器(样式)兼容的技 ...

  2. CSS兼容性解决方法!important的IE7,Firefox问题

    转自:http://www.codesky.net/article/201008/139903.html 1. 首先谈谈!important问题的引起(盒模型问题): 在CSS标准中,一个盒模型包括4 ...

  3. CSS之Medial Queries的另一用法:实现IE hack的方法

    所谓Medial Queries就是媒体查询. 随着Responsive设计的流行,Medial Queries可算是越来越让人观注了.他可以让Web前端工程实现不同设备下的样式选择,让站点在不同的设 ...

  4. 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结

    史上最全的CSS hack方式一览 2013年09月28日 15:57:08 阅读数:175473 做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我 ...

  5. Safari的CSS HACK方法

    以前的文章里提到过IE6/IE7/IE8/IE9/.Firefox的CSS HACK方法,那么Safari的CSS HACK是什么呢?   请看以下CSS代码: .box { color: black ...

  6. css hack方法总结

    IE6识别:下划线 _ 和 星号 *IE7识别:星号 *IE6-IE10识别: \9 css hack方式,条件注释法<!--[if IE]>这段文字只在IE浏览器显示<![endi ...

  7. IE7,6与Fireofx的CSS兼容性处理方法集结

    CSS对浏览器的兼容性有时让人很头疼,尤其是对于IE6这个问题多多的浏览器版本,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于web2.0的过度,请尽量用xhtml格式写代码 ...

  8. CSS Hack技术介绍及常用的Hack技巧集锦

    一.什么是CSS Hack? 不同的浏览器对CSS的解析结果是不同的,因此会导致相同的CSS输出的页面效果不同,这就需要CSS Hack来解决浏览器局部的兼容性问题.而这个针对不同的浏览器写不同的CS ...

  9. 【荐】说说CSS Hack 和向后兼容

    人一旦习惯了某些东西就很难去改,以及各种各样的原因,新的浏览器越来越多,而老的总淘汰不了.增长总是快于消亡导致了浏览器兼容是成了谈不完的话题.说 到浏览器兼容,CSS HACK自然而然地被我们想起.今 ...

随机推荐

  1. c#基础语言编程-文件流操作

    引言 在System.IO 命名空间下提供了一系列的类,我们可以通过相应的类进行文件.目录.数据流的操作. 1.File类:提供用于创建.复制.删除.移动和打开文件的静态方法.File类 2.File ...

  2. ListBoxControl 删除选择的项的方法

    public void RemoveSelectItems<T>(BaseListBoxControl listControl)        {            var list ...

  3. winform 窗体最大化 分类: WinForm 2014-07-17 15:57 215人阅读 评论(0) 收藏

    1:窗体首次加载时最大化 (1):主窗体 this.WindowState = FormWindowState.Maximized; //窗体显示中间部分,不显示窗体名称和最小化.最大化.关闭按钮   ...

  4. HDU-4041-Eliminate Witches! (11年北京网络赛!!)

    Eliminate Witches! Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Other ...

  5. 如何学习一门新技术-iOS开发

    如何快速学习一门新技术 以CoreBluetooth 蓝牙开发为例.我们可以从官方获得的资源有:SampleCode, Documentation,API Reference. 先从Documenta ...

  6. 【Android】android镜像翻转

    Android镜像翻转指的是将屏幕进行水平的翻转,达到所有内容显示都会反向的效果,就像是在镜子中看到的界面一样.这种应用的使用场景相对比较受限,主要用在一些需要使用Android手机界面进行镜面投影的 ...

  7. table转list

    DataTable数据集转换为List非泛型以及泛型方式 前言 DataTable是断开式的数据集合,所以一旦从数据库获取,就会在内存中创建一个数据的副本,以便使用.由于在实际项目中,经常会将 Dat ...

  8. CakePHP的blog教程三

    简单的身份验证和授权应用 接着我们blog教程的例子,如果我们想要建立一个根据登录的用户身份来决定其安全访问到正确的urls. 同时我们还有其他的需求: 允许我们的blog有多个作者,每一个作者都可以 ...

  9. 传统的log4j实战

    /** * */ package log4j; import org.apache.log4j.Logger; import org.apache.log4j.PropertyConfigurator ...

  10. 我的C# - Web - DAL- DBHelper.cs

    其中的部分内容是别人的,我修改过了并加入了详细的注释!!! 一.这个DBHelper的大致块儿如下图: 二.下面是具体的源代码: //命名空间..... using System;using Syst ...