自从安装了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 <!--[if IE 9]> <h2>IE9</h2> |
说明:以上针对不同IE显示不同网页内容DIV+CSS实例实验。
DIV+CSS实例二 :
让IE6-IE8显示不同CSS样式效果,DIV CSS代码如下:
<!DOCTYPE <style type="text/css"> <style type="text/css"> <!--[if IE 9]> |