自从安装了IE8.0正式版本!木头
就对基本的几个 CSS
HACK的做一下归纳!希望对网页前端布局DIV+CSS的实施者有所帮助!
本文就主要以:IE6+IE7+IE8+IE9+FF为主要研究对象
HACK原理:不同浏览器对各中字符的识别不同
(读完文章你会发现,FF和IE8对以下字符的识别能力完全相同)
在
CSS中常用特殊字符识别表:
(1)*
: IE6+IE7
都能识别*,而标准浏览器FF+IE8是不能识别*的;
(2)!important
:
除IE6不能识别 !important外, FF+IE8+IE7
都能识别!important
;
(3)_
: 除IE6
支持_ 外, FF+IE8+IE7都不支持_;
(4)\9
:所有IE
浏览器都识别(IE6、IE7、IE8、IE9)
示例:
(1)区别FF(IE8)与IE6
IE7
backgorund:orange; FF和IE8背景色将为橘黄色
*backgorund:red; IE6和IE7背景色将为红色
(2)区别FF(IE8)与IE6与IE7
background:orange; FF和IE8背景色将为橘黄色
*background:red
!important; IE7背景色将为红色
*background:blue; IE6背景色将为蓝色
(3)区别FF(IE8)与IE6与IE7
background:orange; FF和IE8背景色将为橘黄色
*background:red; IE7背景色将为红色
_background:blue; IE6背景色将为蓝色
(4)区别FF与IE6
IE7 E8
color:gray;
FF等非IE浏览器字体色将为灰色
color:red\9;
IE8 IE9字体色将为红色
*color:green;
IE7字体色将为绿色
_color:blue;
IE6字体色将为蓝色
提示:CSS
HACK书写顺序:先写FF等非IE浏览器所需样式，其次写IE8所需样式，接着是IE7的，再接着才是IE6的！
总结:实际运用中我感觉比较少用到!important
,只要你记住"*"和"_"我想就足够区别于FF(IE8)与IE6与IE7了.
==========================================================
1、Css if hack条件语法
< !--[if IE]>
Only IE <![endif]-->
仅所有的WIN系统自带IE可识别
< !--[if IE 5.0]> Only IE 5.0
<![endif]-->
只有IE5.0可以识别
<
!--[if gt IE 5.0]> Only IE 5.0+
<![endif]-->
IE5.0包换IE5.5都可以识别
< !--[if lt IE 6]> Only IE 6-
<![endif]-->
仅IE6可识别
< !--[if
gte IE 6]> Only IE 6/+ <![endif]-->
IE6以及IE6以下的IE5.x都可识别
<!--[if lte IE 7]> Only IE 7/-
<![endif]-->
仅IE7可识别
< !--[if
gte IE 7]> Only IE 7/+
<![endif]-->
IE7以及IE7以下的IE6、IE5.x都可识别
<!--[if IE 8]> Only IE 8/-
<![endif]-->
仅IE8可识别
<!--[if IE 9]> Only IE 9/-
<![endif]-->
仅IE9可识别
注
：在 if 后加 lt gte有不同效果 （参加其它参数同理）
<!–[if IE 8]> = IE8 仅IE8可识别
<!–[if lt IE 8]> = IE7或更低版本
<!–[if gte IE 8]> = 高于或者等于IE8版本
2、DIV+CSS实例
CSS实例一：
让IE6-IE8显示不同的内容，DIV CSS代码如下：
|
<!DOCTYPE
html>
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8" />
<title>DIV
IF条件实例</title>
</head>
<body>
你正在使用：
<!--[if IE
7]>
<h2>IE7</h2>
<![endif]-->
<!--[if IE
6]>
<h2>IE6</h2>
<![endif]-->
<!--[if IE
8]>
<h2>IE8</h2>
<![endif]-->
<!--[if IE 9]>
<h2>IE9</h2>
<![endif]-->
<br><br>
<strong>说明</strong>：如果你的浏览器版本为多少即会显示IE多少，针对IE6-IE9实验</body>
</html>
|
说明：以上针对不同IE显示不同网页内容DIV+CSS实例实验。
DIV+CSS实例二
：
让IE6-IE8显示不同CSS样式效果，DIV CSS代码如下：
|
<!DOCTYPE
html>
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8" />
<title>CSS
IF条件hack实例</title>
<!--[if IE 6]>
<style
type="text/css">
.divcss{
color:#F00;}
</style>
<![endif]-->
<!--[if IE 7]>
<style type="text/css">
.divcss{
color:#FF0;}
</style>
<![endif]-->
<!--[if IE 8]>
<style type="text/css">
.divcss{
color:#00F;}
</style>
<![endif]-->
<!--[if IE 9]>
<style
type="text/css">
.divcss{
color:#000;}
</style>
<![endif]-->
</head>
<body>
<div
class="divcss">
DIV
CSS实验提示：<br>
我在IE6下是红颜色，在IE7下是黄颜色,在IE8下是蓝颜色,在IE9下是黑色
</div>
</body>
</html>
|
说明：以上实验仅实验IE6-IE9下if HACK。
分享到：
相关推荐
搜集整理的CSS HACK，也即是在多种浏览器（主要是ie6 ie7 ie8 ff)下样式统一的解决办法。 内容还是较全的，前台开发中常见的兼容性问题都可以找到解决方法，值得研究。 包括各浏览器CSS hack,技巧。有实例。
CSS完美兼容IE6/IE7/FF的通用方法 一、CSS HACK 以下两种方法几乎能解决现今所有HACK.
省市县选择器，支持 ie6/7/8 和火狐
ie6 ie7 ff浏览器兼容 border:2px solid #00f; /*IE、ff的属性*/ border:2px solid #090\9; /* IE6/7/8的属性 */ border:2px solid #F90\0; /* IE8支持 */ *border:2px solid #F00; /* IE6、7支持 */ _border:2...
css浏览器兼容写法 如果只让ie6看见用*html .head{color:#000;} 如果只让ie7看见用*+html .head{color:#000;} 如果只让ff看见用:root body .head{color:#000;} 如果只让ff、IE8看见用html>/**/body .head{color:#000...
通过CSS Hack 区分 FF/IE7/IE6/IE5.5/IE5 代码推荐
区分ie 6 7 8 ; background:红色; /*非ie显示*/ bankground:蓝色 \9; /*ie显示*/ }
CSS hack实现 CSS完美兼容IE6/IE7/FF的通用方法
div css完美兼容IE6，IE7，FF的通用方法说明。
CSS样式兼容IE6、IE7、IE8、FF火狐浏览器的方法
CSS兼容IE6,IE7和FF的总结 . 区别IE6与FF： background:orange;*background:blue; 区别IE6与IE7： background:green !important;background:blue; 区别IE7与FF： background:orange; *background:green; ...
CSS完美兼容IE6IE7FF的通用方法
important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.)<style>#wrapper{width: 100px!important; /* IE7+FF */width: 80px; /* IE6 */}</style> 2, IE6/IE77对FireFox *+html 与 *...
CSS Hack 浏览器兼容文档 ，用于兼容IE6、IE7、IE8、IE9、FF
浏览器兼容解决FF/IE6/IE7背景专用CSS HACK
CSS代码： 复制代码代码如下: <style type=”text/css”> #body { border:2px solid #00f;...复制代码代码如下: ”body”> <ul> <li>FF下蓝边</li> <li>IE6下红边</li> <li>IE7下绿边</li> <li>
浏览器兼容CSS ,IE6.IE7,FF
一个图片居中的CSS示例，兼容IE6,7,8和FF，opera,safari