@EncyKe
2015-09-27T16:01:06.000000Z
字数 17599
阅读 2499
CSS 前端
zoom:1zoom:1;为IE特有的属性，一般用以解决IE 6中的子元素浮动时候父元素高度塌陷的问题，功能相当于overflow:auto，同样也可以用height:1%来代替zoom:1。所以一般要在浮动元素的父元素加上overflow:auto; zoom:1;。这样，子元素浮动，父元素将自动跟子元素扩大，保持BFC属性。
haslayout[1][2]haslayout是IE渲染引擎的一个内部组成部分。在IE中，使用layout (布局) 来控制元素的尺寸和定位。为提高性能，只有部分元素默认拥有layout。
拥有布局 (have layout) 的元素负责本身及其子元素的尺寸和定位。
若一个元素没有layout，那么它的尺寸和位置由最近的拥有layout的祖先元素控制。
故一个元素要么自己对自身的内容进行计算大小和组织，要么依赖于父元素来计算尺寸和组织内容。
IE采用haslayout(值为true或false)属性定义元素是否具有haslayout。
一些元素默认会有一个layout。没有layout也可以通过设置某些CSS属性获得。
获得了haslayout的元素既有了BFC，这对含浮动或绝对定位子元素的父元素而言尤其有用，在IE下可有效修复其高度塌陷问题。
默认拥有或设置获取layout的HTML元素的haslayout的值一定只有true；且haslayout为只读属性，一旦被触发，就不可逆转。
查询：在IE Developer Toolbar下，拥有haslayout的元素，通常显示为haslayout = -1。或者可以在IE 5.5+地址栏中输入javascript: alert(元素id.currentStyle.hasLayout)即可查询有无layout。
haslayout属性的元素<html>, <body>
<table>, <tr>, <th>, <td>
<img>
<hr>
<input>, <button>, <select>, <textarea>, <fieldset>, <legend>
<iframe>, <embed>, <object>, <applet>
<marquee>
haslayout属性的方法haslayout属性不能直接设定，只能通过设置一些特定的css属性来触发并改变haslayout状态：
display触发：inline-block
取消：其它值
width/height触发：除auto外的值
取消：auto
(对IE 6及更早版本来说很常用，该方法被称为霍莉破解 (Holly hack)，即设定这个元素height:1%;。但是要注意，当这个元素的overflow属性被设置为visible时，这个方法就失效了。)
position触发：absolute
取消：static
float触发：left/right
取消：none
zoom触发：存在值即可
取消：normal/空值
(IE私有属性，不兼容标准。)
min-height: 任何值
max-height: 任何值除了none
min-width: 任何值
max-width: 任何值除了none
overflow: 任何值除了visible
overflow-x: 任何值除了visible
overflow-y: 任何值除了visible
position: fixed
_：IE 6独有；-：IE 6独有；+：IE 6、IE 7；*：IE 6、IE 7；#：IE 6、IE 7；\9：IE 6、IE 7、IE 8、IE 9、IE 10+；\0：IE 8、IE 9、IE 10+；\9\0：IE 9、IE 10+；!important：除IE 6以外，表优先级最高，如：
.a{
margin: 0 !important;
margin: 10px;
}
则!important;语句生效；
但对IE 6，并无效，除非写作：
.a{margin: 0 !important;}
.a{margin: 10px;}
如此才使得!important语句有效；
*html selector{}：IE 6独有；*+html selector{}或者*:first-child + html selector{}：IE 7独有；针对所有IE (注意：IE 10+已经不再支持条件注释)：
<!--[if IE]>只在IE浏览器显示<![endif]--><!--[if IE 6]>只在IE 6浏览器显示<![endif]--><!--[if lt IE 6]>只在IE 6-浏览器显示的内容<![endif]--><!--[if gte IE 6]>只在IE 6+(含)浏览器显示<![endif]--><!--[if ! IE 8]>只在非IE 8浏览器显示<![endif]--><!--[if !IE]>只在非IE浏览器显示<![endif]-->
这类Hack不仅对CSS生效，对写在判断语句里面的所有代码都会生效。
meta中X-UA-Compatible设定IE兼容性注意：
X-UA-Compatible设定IE兼容性；X-UA-compatible标头没有大小写之分；但必须被置于除<title>及其他的<meta>元素外头部其它元素之前；X-UA-compatible的<meta>指令即可，因为IE 8+永远只识别第一条；用法：
<meta http-equiv="X-UA-Compatible" content="IE=7"><!-- 无论是否用DTD声明文档标准，IE 8+浏览器都会以IE 7引擎来渲染页面。 --><meta http-equiv="X-UA-Compatible" content="IE=edge"><!-- IE 8+浏览器都会以最高版本IE来渲染页面。 -->
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8"><!-- 指示IE使用<!DOCTYPE>指令来决定如何编译内容。Standards mode指令会显示成IE 8 Standards mode；而quirks mode会显示成IE 5 mode。不同于IE 8 mode，Emulate IE 8 mode重视<!DOCTYPE>指令。 --><meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"><!-- 指示IE使用<!DOCTYPE>指令来决定如何编译内容。Standards mode指令会显示成IE 7 Standards mode；而quirks mode会显示成IE 5 mode。不同于IE7 mode，Emulate IE 7 mode重视<!DOCTYPE>指令。对于许多网页来说这是最推荐的兼容性模式。 -->
<meta http-equiv="X-UA-Compatible" content="IE=7,IE=9"><meta http-equiv="X-UA-Compatible" content="IE=7,9"><!-- 可以规避按照IE 8来渲染 --><meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"><!-- IE=edge告诉IE使用最新的引擎渲染网页，chrome=1则可以激活Chrome Frame. -->
<!--[if lt IE9]><script>(function() {if (!/*@cc_on!@*/0) return;var e = "abbr, article, aside, audio, canvas, datalist, details, dialog, eventsource, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, time, video".split(', ');var i= e.length;while (i--){document.createElement(e[i])}})()</script><![endif]-->
<!--[if lt IE9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
推荐下载成本地HTML5.shiv.js文件：
/*HTML5 Shiv v3.7.0 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed*/(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag();a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/[\w\-]+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x<style>article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}</style>";c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="<xyz></xyz>";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode||"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output progress section summary template time video",version:"3.7.0",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f);if(g)return a.createDocumentFragment();for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d<h;d++)c.createElement(e[d]);return c}};l.html5=e;q(f)})(this,document);
除此外，还需手工块状化新标签：
/*html5*/article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
CSS3中的border-radius对IE 8及以下不起作用，可以通过Diller Design的DD_roundies.js解决：
<script src="DD_roundies.js"></script><!-- 引入js文件，压缩文件见下 --><script>DD_roundies.addRule('.corner', '10px');<!-- 使用corner类名者均能获得10px圆角 --><!-- 注意：在IE 8或以下生效，IE 9+及现代浏览器不支持 --><!-- 注意：对table、td、tr、select、option等元素的圆角并不支持 --></script>
或者：
<script src="DD_roundies.js"></script><!-- 引入js文件，压缩文件见下 --><script>DD_roundies.addRule('.corner', 5, true);<!-- 传入true使现代浏览器也能获得圆角 --></script>
源文件 (压缩)：
/*** DD_roundies, this adds rounded-corner CSS in standard browsers and VML sublayers in IE that accomplish a similar appearance when comparing said browsers.* Author: Drew Diller* Email: drew.diller@gmail.com* URL: http://www.dillerdesign.com/experiment/DD_roundies/* Version: 0.0.2a - preview 2008.12.26* Licensed under the MIT License: http://dillerdesign.com/experiment/DD_roundies/#license** Just want the PNG fixing effect for IE6, and don't want to also use the DD_belatedPNG library? Don't give any additional arguments after the CSS selector.* DD_roundies.addRule('.your .example img');**/eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('t K={16:\'K\',1L:G,1M:G,1d:G,2f:y(){u(D.2g!=8&&D.1N&&!D.1N[q.16]){q.1L=M;q.1M=M}17 u(D.2g==8){q.1d=M}},2h:D.2i,1O:[],1b:{},2j:y(){u(q.1L||q.1M){D.1N.2L(q.16,\'2M:2N-2O-2P:x\')}u(q.1d){D.2Q(\'<?2R 2S="\'+q.16+\'" 2T="#1P#2k" ?>\')}},2l:y(){t a=D.1k(\'z\');D.2m.1w.1Q(a,D.2m.1w.1w);u(a.12){2n{t b=a.12;b.1x(q.16+\'\\\\:*\',\'{1l:2U(#1P#2k)}\');q.12=b}2o(2p){}}17{q.12=a}},1x:y(a,b,c){u(1R b==\'1S\'||b===2V){b=0}u(b.2W.2q().1y(\'2X\')==-1){b=b.2q().2Y(/[^0-9 ]/g,\'\').1T(\' \')}H(t i=0;i<4;i++){b[i]=(!b[i]&&b[i]!==0)?b[C.1e((i-2),0)]:b[i]}u(q.12){u(q.12.1x){t d=a.1T(\',\');H(t i=0;i<d.1U;i++){q.12.1x(d[i],\'1l:2Z(K.1V.2r(q, [\'+b.1W(\',\')+\']))\')}}17 u(c){t e=b.1W(\'F \')+\'F\';q.12.1z(D.2s(a+\' {Q-1f:\'+e+\'; -30-Q-1f:\'+e+\';}\'));q.12.1z(D.2s(a+\' {-1A-Q-1m-1n-1f:\'+b[0]+\'F \'+b[0]+\'F; -1A-Q-1m-1X-1f:\'+b[1]+\'F \'+b[1]+\'F; -1A-Q-1Y-1X-1f:\'+b[2]+\'F \'+b[2]+\'F; -1A-Q-1Y-1n-1f:\'+b[3]+\'F \'+b[3]+\'F;}\'))}}17 u(q.1d){q.1O.31({\'2t\':a,\'2u\':b})}},2v:y(a){2w(32.33){I\'z.Q\':I\'z.34\':I\'z.1B\':q.1o(a);13;I\'z.2x\':q.1Z(a);13;I\'z.1p\':I\'z.2y\':I\'z.2z\':q.1o(a);13;I\'z.20\':a.18.z.20=(a.z.20==\'S\')?\'S\':\'35\';13;I\'z.21\':q.22(a);13;I\'z.1c\':a.18.z.1c=a.z.1c;13}},1o:y(a){a.14.23=\'\';q.2A(a);q.1Z(a);q.1C(a);q.1D(a);q.24(a);q.2B(a);q.22(a)},22:y(a){u(a.W.21.1y(\'36\')!=-1){t b=a.W.21;b=1g(b.37(b.25(\'=\')+1,b.25(\')\')),10)/2C;H(t v 1h a.x){a.x[v].1i.38=b}}},2A:y(a){u(!a.W){1q}17{t b=a.W}a.14.1p=\'\';a.14.1E=\'\';t c=(b.1p==\'2D\');t d=M;u(b.1E!=\'S\'||a.1F){u(!a.1F){a.J=b.1E;a.J=a.J.39(5,a.J.25(\'")\')-5)}17{a.J=a.26}t e=q;u(!e.1b[a.J]){t f=D.1k(\'3a\');f.1r(\'3b\',y(){q.1s=q.3c;q.1t=q.3d;e.1D(a)});f.3e=e.16+\'3f\';f.14.23=\'1l:S; 1j:27; 1m:-2E; 1n:-2E; Q:S;\';f.26=a.J;f.2F(\'1s\');f.2F(\'1t\');D.2G.1Q(f,D.2G.1w);e.1b[a.J]=f}a.x.Z.1i.26=a.J;d=G}a.x.Z.2H=!d;a.x.Z.1G=\'S\';a.x.1u.2H=!c;a.x.1u.1G=b.1p;a.14.1E=\'S\';a.14.1p=\'2D\'},1Z:y(a){a.x.1H.1G=a.W.2x},1C:y(a){t c=[\'N\',\'19\',\'1a\',\'O\'];a.P={};H(t b=0;b<4;b++){a.P[c[b]]=1g(a.W[\'Q\'+c[b]+\'U\'],10)||0}},1D:y(c){t e=[\'O\',\'N\',\'U\',\'V\'];H(t d=0;d<4;d++){c.E[e[d]]=c[\'3g\'+e[d]]}t f=y(a,b){a.z.1n=(b?0:c.E.O)+\'F\';a.z.1m=(b?0:c.E.N)+\'F\';a.z.1s=c.E.U+\'F\';a.z.1t=c.E.V+\'F\'};H(t v 1h c.x){t g=(v==\'Z\')?1:2;c.x[v].3h=(c.E.U*g)+\', \'+(c.E.V*g);f(c.x[v],M)}f(c.18,G);u(K.1d){c.x.1H.z.28=\'-3i\';u(1R c.P==\'1S\'){q.1C(c)}c.x.1u.z.28=(c.P.N-1)+\'F \'+(c.P.O-1)+\'F\'}},24:y(j){t k=y(a,w,h,r,b,c,d){t e=a?[\'m\',\'1I\',\'l\',\'1J\',\'l\',\'1I\',\'l\',\'1J\',\'l\']:[\'1J\',\'l\',\'1I\',\'l\',\'1J\',\'l\',\'1I\',\'l\',\'m\'];b*=d;c*=d;w*=d;h*=d;t R=r.2I();H(t i=0;i<4;i++){R[i]*=d;R[i]=C.3j(w/2,h/2,R[i])}t f=[e[0]+C.11(0+b)+\',\'+C.11(R[0]+c),e[1]+C.11(R[0]+b)+\',\'+C.11(0+c),e[2]+C.15(w-R[1]+b)+\',\'+C.11(0+c),e[3]+C.15(w+b)+\',\'+C.11(R[1]+c),e[4]+C.15(w+b)+\',\'+C.15(h-R[2]+c),e[5]+C.15(w-R[2]+b)+\',\'+C.15(h+c),e[6]+C.11(R[3]+b)+\',\'+C.15(h+c),e[7]+C.11(0+b)+\',\'+C.15(h-R[3]+c),e[8]+C.11(0+b)+\',\'+C.11(R[0]+c)];u(!a){f.3k()}t g=f.1W(\'\');1q g};u(1R j.P==\'1S\'){q.1C(j)}t l=j.P;t m=j.2J.2I();t n=k(M,j.E.U,j.E.V,m,0,0,2);m[0]-=C.1e(l.O,l.N);m[1]-=C.1e(l.N,l.19);m[2]-=C.1e(l.19,l.1a);m[3]-=C.1e(l.1a,l.O);H(t i=0;i<4;i++){m[i]=C.1e(m[i],0)}t o=k(G,j.E.U-l.O-l.19,j.E.V-l.N-l.1a,m,l.O,l.N,2);t p=k(M,j.E.U-l.O-l.19+1,j.E.V-l.N-l.1a+1,m,l.O,l.N,1);j.x.1u.29=o;j.x.Z.29=p;j.x.1H.29=n+o;q.2K(j)},2B:y(a){t s=a.W;t b=[\'N\',\'O\',\'19\',\'1a\'];H(t i=0;i<4;i++){a.14[\'1B\'+b[i]]=(1g(s[\'1B\'+b[i]],10)||0)+(1g(s[\'Q\'+b[i]+\'U\'],10)||0)+\'F\'}a.14.Q=\'S\'},2K:y(e){t f=K;u(!e.J||!f.1b[e.J]){1q}t g=e.W;t h={\'X\':0,\'Y\':0};t i=y(a,b){t c=M;2w(b){I\'1n\':I\'1m\':h[a]=0;13;I\'3l\':h[a]=0.5;13;I\'1X\':I\'1Y\':h[a]=1;13;1P:u(b.1y(\'%\')!=-1){h[a]=1g(b,10)*0.3m}17{c=G}}t d=(a==\'X\');h[a]=C.15(c?((e.E[d?\'U\':\'V\']-(e.P[d?\'O\':\'N\']+e.P[d?\'19\':\'1a\']))*h[a])-(f.1b[e.J][d?\'1s\':\'1t\']*h[a]):1g(b,10));h[a]+=1};H(t b 1h h){i(b,g[\'2y\'+b])}e.x.Z.1i.1j=(h.X/(e.E.U-e.P.O-e.P.19+1))+\',\'+(h.Y/(e.E.V-e.P.N-e.P.1a+1));t j=g.2z;t c={\'T\':1,\'R\':e.E.U+1,\'B\':e.E.V+1,\'L\':1};t k={\'X\':{\'2a\':\'L\',\'2b\':\'R\',\'d\':\'U\'},\'Y\':{\'2a\':\'T\',\'2b\':\'B\',\'d\':\'V\'}};u(j!=\'2c\'){c={\'T\':(h.Y),\'R\':(h.X+f.1b[e.J].1s),\'B\':(h.Y+f.1b[e.J].1t),\'L\':(h.X)};u(j.1y(\'2c-\')!=-1){t v=j.1T(\'2c-\')[1].3n();c[k[v].2a]=1;c[k[v].2b]=e.E[k[v].d]+1}u(c.B>e.E.V){c.B=e.E.V+1}}e.x.Z.z.3o=\'3p(\'+c.T+\'F \'+c.R+\'F \'+c.B+\'F \'+c.L+\'F)\'},1v:y(a){t b=q;2d(y(){b.1o(a)},1)},2e:y(a){q.1D(a);q.24(a)},1V:y(b){q.z.1l=\'S\';u(!q.W){1q}17{t c=q.W}t d={3q:G,3r:G,3s:G,3t:G,3u:G,3v:G,3w:G};u(d[q.1K]===G){1q}t e=q;t f=K;q.2J=b;q.E={};t g={3x:\'2e\',3y:\'2e\'};u(q.1K==\'A\'){t i={3z:\'1v\',3A:\'1v\',3B:\'1v\',3C:\'1v\'};H(t a 1h i){g[a]=i[a]}}H(t h 1h g){q.1r(\'3D\'+h,y(){f[g[h]](e)})}q.1r(\'3E\',y(){f.2v(e)});t j=y(a){a.z.3F=1;u(a.W.1j==\'3G\'){a.z.1j=\'3H\'}};j(q.3I);j(q);q.18=D.1k(\'3J\');q.18.14.23=\'1l:S; 1j:27; 28:0; 1B:0; Q:0; 3K:S;\';q.18.z.1c=c.1c;q.x={\'1u\':M,\'Z\':M,\'1H\':M};H(t v 1h q.x){q.x[v]=D.1k(f.16+\':3L\');q.x[v].1i=D.1k(f.16+\':3M\');q.x[v].1z(q.x[v].1i);q.x[v].3N=G;q.x[v].z.1j=\'27\';q.x[v].z.1c=c.1c;q.x[v].3O=\'1,1\';q.18.1z(q.x[v])}q.x.Z.1G=\'S\';q.x.Z.1i.3P=\'3Q\';q.3R.1Q(q.18,q);q.1F=G;u(q.1K==\'3S\'){q.1F=M;q.z.3T=\'3U\'}2d(y(){f.1o(e)},1)}};2n{D.3V("3W",G,M)}2o(2p){}K.2f();K.2j();K.2l();u(K.1d&&D.1r&&K.2h){D.1r(\'3X\',y(){u(D.3Y==\'3Z\'){t d=K.1O;t e=d.1U;t f=y(a,b,c){2d(y(){K.1V.2r(a,b)},c*2C)};H(t i=0;i<e;i++){t g=D.2i(d[i].2t);t h=g.1U;H(t r=0;r<h;r++){u(g[r].1K!=\'40\'){f(g[r],d[i].2u,r)}}}}})}',62,249,'||||||||||||||||||||||||||this|||var|if|||vml|function|style|||Math|document|dim|px|false|for|case|vmlBg|DD_roundies||true|Top|Left|bW|border||none||Width|Height|currentStyle|||image||floor|styleSheet|break|runtimeStyle|ceil|ns|else|vmlBox|Right|Bottom|imgSize|zIndex|IE8|max|radius|parseInt|in|filler|position|createElement|behavior|top|left|applyVML|backgroundColor|return|attachEvent|width|height|color|pseudoClass|firstChild|addRule|search|appendChild|webkit|padding|vmlStrokeWeight|vmlOffsets|backgroundImage|isImg|fillcolor|stroke|qy|qx|nodeName|IE6|IE7|namespaces|selectorsToProcess|default|insertBefore|typeof|undefined|split|length|roundify|join|right|bottom|vmlStrokeColor|display|filter|vmlOpacity|cssText|vmlPath|lastIndexOf|src|absolute|margin|path|b1|b2|repeat|setTimeout|reposition|IEversion|documentMode|querySelector|querySelectorAll|createVmlNameSpace|VML|createVmlStyleSheet|documentElement|try|catch|err|toString|call|createTextNode|selector|radii|readPropertyChanges|switch|borderColor|backgroundPosition|backgroundRepeat|vmlFill|nixBorder|100|transparent|10000px|removeAttribute|body|filled|slice|DD_radii|clipImage|add|urn|schemas|microsoft|com|writeln|import|namespace|implementation|url|null|constructor|Array|replace|expression|moz|push|event|propertyName|borderWidth|block|lpha|substring|opacity|substr|img|onload|offsetWidth|offsetHeight|className|_sizeFinder|offset|coordsize|1px|min|reverse|center|01|toUpperCase|clip|rect|BODY|TABLE|TR|TD|SELECT|OPTION|TEXTAREA|resize|move|mouseleave|mouseenter|focus|blur|on|onpropertychange|zoom|static|relative|offsetParent|ignore|background|shape|fill|stroked|coordorigin|type|tile|parentNode|IMG|visibility|hidden|execCommand|BackgroundImageCache|onreadystatechange|readyState|complete|INPUT'.split('|'),0,{}))
CSS3中的text-shadow对IE 9及以下 (甚至IE 10) 不起作用，可以借助IE自带的滤镜解决。IE滤镜学问繁杂，因为时代原因也慢慢脱离，不谈掌握，了解即可。
filter:glow(color=black,strength=5);
表5px扩散大小的黑色光晕；
filter:progid:DXImageTransform.Microsoft.MotionBlur(strength=5, direction=145);
表145°上5px大小的动感模糊；
此法可能要配合在原有作动感模糊的文本前复制一段文本做绝对定位以填坑而获取更好视觉效果；
同方法二，用两段一样的文本，第一段声明如下样式，第二段紧随即可；1px的偏移投影是最适用的情况；
margin: -1px 0 0 -1px;position: absolute;
filter:progid:DXImageTransform.Microsoft.shadow(Color='gray', Direction='180', Strength='4');
其中，color表投影底色，值为英文字母；direction表投影方向 (0为垂直投影，以此类推)；strength设置或检索以对象为基准的在运动方向上的向外扩散距离；
CSS3中的rgba()颜色声明对IE 8及以下无效，同样可由IE滤镜解决：
filter:alpha(opacity=50);
数值即为rgba()中a值乘以100；但需注意：相比于rgba()只让元素本身半透明而子元素不继承半透明，这一alpha滤镜将整个元素连同子级半透明，故对于特定的如文字及其阴影、边框等就无法选择性半透明。
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#AARRGGBB,endColorStr=i#AARRGGBB)
其中，startColorStr或endColorStr均为可选项；AARRGGBB中：RRGGBB为hex色值，AA则为透明度 (00表全透明，FF表全不透明，以此类推)；
CSS3中的transform同样在IE 8及以下都死了，但同样的解决方式都是：IE滤镜。CSS3变形特效在IE中都是以其Matrix滤镜来实现的，但这一滤镜用法专业、难懂，还要求一定的数学和矩阵知识基础，推荐一款傻瓜工具以急用：Transform Translator，基本能满足简单的CSS3transform效果在IE上的兼容。
综上，很多对IE的兼容其实都会用到滤镜。滤镜是不被W3C正式承认的，所以无法通过验证，事实上除了滤镜，上述很多兼容性写法都是无法通过W3C验证的。滤镜应该是当年IE称霸天下时MS为其设计的一种专有、定制的样式效果实现方法，在被现代浏览器抢占市场的这几年，滤镜似乎成了MS的某种自high。所以其实在很多场合、很多教程中我们都被劝诫少用滤镜；现在能用到滤镜的基本就只是为了兼容IE 8-而已了吧？但反过来讲，IE的滤镜之所以总能成为我们对CSS3的兼容手段，是不是某种程度上也说明了，当年MS的想法很能符合现在CSS3新特性的设计潮流呢？纯粹个人想法和吐槽而已。
P.S.1: 附滤镜知识参考两份：
IE中CSS-filter滤镜小知识大全
css的filter简介
P.S.2: 本文只是笔者在实际项目中遇见过的IE兼容方式的整理、总结，限于水平，未能提供更多。