以下两种方法几乎能解决现今所有HACK.
1, !important (不是很推荐，用下面的一种感觉最安全)
随着IE7对!important的支持, !important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.)
代码:
<style>
#wrapper {
width: 100px!important; /* IE7+FF */
width: 80px; /* IE6 */
}
</style>
2, IE6/IE77对FireFox <from 针对firefox ie6 ie7的css样式>
*+html 与 *html 是IE特有的标签, firefox 暂不支持.而*+html 又为 IE7特有标签.
代码:
<style>
#wrapper { width: 120px; } /* FireFox */
*html #wrapper { width: 80px;} /* ie6 fixed */
*+html #wrapper { width: 60px;} /* ie7 fixed, 注意顺序 */
</style>
注意:
*+html 对IE7的HACK 必须保证HTML顶部有如下声明：
代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
二、万能 float 闭合(非常重要!) 可以用这个解决多个div对齐时的间距不对，
关于 clear float 的原理可参见 [How To Clear Floats Without Structural Markup]
将以下代码加入Global CSS 中,给需要闭合的div加上 class=”clearfix” 即可,屡试不爽.
代码:
<style>
/* Clear Fix */
.clearfix:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix {
display:inline-block;
}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */
/* end of clearfix */
</style>
三、其他兼容技巧(相当有用)
1, FF下给 div 设置 padding 后会导致 width 和 height 增加, 但IE不会.(可用!important解决)
2, 居中问题.
1).垂直居中.将 line-height 设置为 当前 div 相同的高度, 再通过 vertical-align: middle.( 注意内容不要换行.)
2).水平居中. margin: 0 auto;(当然不是万能)
3, 若需给 a 标签内内容加上 样式, 需要设置 display: block;(常见于导航标签)
4, FF 和 IE 对 BOX 理解的差异导致相差 2px 的还有设为 float的div在ie下 margin加倍等问题.
5, ul 标签在 FF 下面默认有 list-style 和 padding . 最好事先声明, 以避免不必要的麻烦. (常见于导航标签和内容列表)
6, 作为外部 wrapper 的 div 不要定死高度, 最好还加上 overflow: hidden.以达到高度自适应.
7, 关于手形光标. cursor: pointer. 而hand 只适用于 IE.贴上代码:
兼容代码:hack最推荐的模式。
/* FF */
.submitbutton {
float:left;
width: 40px;
height: 57px;
margin-top: 24px;
margin-right: 12px;
}
/* IE6 */
*html .submitbutton {
margin-top: 21px;
}
/* IE7 */
*+html .submitbutton {
margin-top: 21px;
}
分享到：
相关推荐
2. **尽量减少使用Hack**：虽然CSS Hack很有用，但过度依赖会导致维护困难。尽可能采用标准CSS来实现兼容性。 3. **测试**：在实际部署前，务必在目标浏览器中进行全面测试，确保所有Hack按预期工作。 #### 六、...
什么是CSS hack： 由于不同的浏览器，对CSS的解析认识不一样，从而导致生成的页面效果不一样，得不到我们所需要的页面效果。 针对不同的浏览器写不同的CSS code的过程，就叫CSS hack,也叫写CSS hack
### CSS-HACK与IE条件注释知识点总结 #### 一、主流浏览器CSS兼容性问题概述 在前端开发过程中，为不同浏览器编写兼容的CSS样式是必不可少的一部分，尤其是对于IE6、IE7、IE8等旧版本浏览器，由于它们遵循的CSS...
史上最全的CSS hack方式一览.mhtml史上最全的CSS hack方式一览.mhtml史上最全的CSS hack方式一览.mhtml史上最全的CSS hack方式一览.mhtml史上最全的CSS hack方式一览.mhtml史上最全的CSS hack方式一览.mhtml史上最全...
CSS Hack是一种针对不同浏览器之间的CSS解析差异而采取的技术策略，目的是确保网页在各种浏览器中都能得到预期的渲染效果。在Web开发中，由于Internet Explorer（尤其是IE6和IE7）与其他标准兼容的浏览器（如Firefox...
【CSS Hack技巧大全】 在网页开发中，CSS（层叠样式表）的兼容性问题一直是一个挑战，尤其是在处理不同浏览器间的表现差异时。CSS Hack是一种技术，用来解决这些差异，确保样式在各种浏览器中都能正确呈现。本文将...
important' to all in style try this// var Css = new CssHack(true);// 2. Set PropertiesCss . setProp ( param ) ;Css . setProps ( [ param , param , ... ] ) ;// 3. Reflect to Cssvar nodes = document . ...
在网页设计和开发中，CSS Hack常常用于解决不同浏览器对CSS样式解析的差异问题。本文主要探讨了如何针对Safari浏览器进行CSS Hack，以便在不同的浏览器环境下实现样式的一致性。 首先，我们要明白CSS Hack的基本...
【前端项目-hack.zip】是一个压缩包，包含了名为“hack-master”的前端项目源代码。这个项目采用了一种名为“死的简单CSS框架”的技术，它旨在简化前端开发过程，为开发者提供一个快速构建用户界面的基础。 一、CSS...
2. **CSS Hack常见字符及示例**： - **星号（*）**：用来区分IE6和IE7与其他浏览器。例如，`*backgorund:red;`将只对IE6和IE7生效，设置背景色为红色。 - **叹号important（!important）**：用于优先级较高的CSS...
PostCSS 100vh修复 [PostCSS]插件来修复[iOS版的bug]与100vh 。 它可以在Chrome（在某些情况下，仅-webkit-fill-available会导致Chrome出现问题），iOS / iPad / MacOS Safari和[所有其他浏览器]中运行。 纯CSS...
2. **iepngfix.htc**：这是一个处理IE浏览器PNG透明度问题的hack。在旧版的Internet Explorer中，PNG图像的透明度支持并不完善，这个.htc文件通过行为（Behavior）技术提供了一种解决方案。然而，随着现代浏览器的...
标题“巧用 UserAgent 代替拙劣的 CSS hack”指出了一种避免使用CSS hack，转而利用UserAgent来实现特定浏览器兼容性的方法。CSS hack常常导致代码可维护性下降，而通过UserAgent判断，我们可以更加优雅地处理浏览器...
本文将深入探讨H5 CSS Hack以及与浏览器内核的关系。 首先，我们要明白H5（HTML5）是HTML的最新版本，引入了许多新特性，如语义化标签、离线存储、媒体元素、拖放功能等，极大地提高了网页的互动性和用户体验。然而...
【压缩包子文件的文件名称列表】"egoist-hack-af0ffdc"是框架的版本号，"egoist"可能是作者的名字或者项目的名字，"hack"对应了框架的名字，"af0ffdc"是Git的提交哈希，通常用来追踪代码库的具体版本，这表示该框架...
"css hack, escape from css hack"的主题旨在探讨如何避免使用CSS hack，遵循更标准和可持续的实践。以下是一些关键知识点： 1. **使用CSS预处理器**：如Sass、Less或Stylus，它们提供了变量、嵌套规则和混合等功能...
这可能涉及到使用hack技巧、条件注释、前缀、重置CSS等方法，确保样式在各个浏览器中的表现一致。 总之，《CSS-浏览器兼容实战》为开发者提供了全面的指导，帮助他们面对复杂多变的浏览器环境，编写出高效、兼容性...
管理系统_酒店预订系统后台管理系统实现_PHP+Hack+CSS_优质项目实战_毕业设计