CSS Hack ×ܽá
ä¯ÀÀÆ÷Ô½À´Ô½¶à£¬²»Í¬µÄä¯ÀÀÆ÷£¬²»Í¬µÄ°æ±¾ÔÚÒ³ÃæµÄäÖȾÉ϶¼¸÷²»Ïàͬ¡£ÕâÈÃÍøÒ³¿ª·¢ÈËÔ±ºÜÍ·ÌÛ£¬ÎªÁËÄܼæÈݸ÷¸öä¯ÀÀÆ÷£¬ÈËÃÇÍÚ¾ò³öÁ˺ܶà CSS Hack¡£ÏÂÃæ½øÐÐÒ»ÏÂ×ܽᣬÈç¹û»¹ÓÐÆäËûµÄ CSS Hack »¶ÓÌṩ¡£
Ò») Õë¶Ô IE µÄ Hack
´ó²¿·Ö CSS Hack ¶¼ÊÇÕë¶Ô IE µÄ£¬ÕâÊÇÓÃÓÚÎÒÃÇµÄ IE "¼áÇ¿"ËùÖ£¬ÓÈÆäÊÇ IE6¡£
#test {
color:red; /*ËùÓÐä¯ÀÀÆ÷*/
+color:blue; /*ËùÓÐ IE */
_color:green; /*IE 6¼°ÒÔÏÂ*/
_color /**/:pink; /*IE 5*/
}
ÓÉÓÚ CSS ÊǺóÃæµÄ¸²¸ÇÇ°ÃæµÄ¡£ËùÒÔÒÔÉÏ CSS ·Ö±ð¶ÔÓ¦ ·ÇIE£¬IE7,8£¬IE6£¬IE5¡£ÒÔÉÏ Hack »ù±¾¿ÉÒÔÂú×ãÐèÇó¡£
²»¹ý IE »¹ÓÐһЩÆäËûµÄ Hack¡£
\9 Hack:
#test {
color:red; /*ËùÓÐä¯ÀÀÆ÷*/
+color:blue\9; /*IE 5 ÒÔÉÏ*/
}
ÔÚÊôÐÔºóÃæ¼Ó¸ö "\9" ¾Í¿ÉÒÔÁË¡£Äã¿ÉÄÜ»áÆæ¹Ö£ºÆäËûµÄÊý×Ö²»ÐÐÂð£¿ÎÒÊÔÁËÏ£¬ºÃÏñÊDz»ÐУ¬²»¹ý 9 Ç°Ãæ¿ÉÒÔ¼Ó¼¸¸ö 0¡£ÎÒ¾õµÃÕâ¸ö²»±ØÉ£¬ÄÜÓþÍÐÐÁË¡£
* html Hack:
#test { /*ËùÓÐä¯ÀÀÆ÷*/
color:red;
}
* html #test { /*IE 6¼°ÒÔÏÂ*/
color:blue;
}
Õâ¸ö Hack ÓÃÓÚÇø·Ö IE6 ºÍÆäËûä¯ÀÀÆ÷¡£ÔÚ CSS ÊôÐԱȽ϶àµÄÇé¿öϱȽÏÓÐÓá£ÖµµÃÒ»ÌáµÄÊÇ£¬Õâ¸ö Hack ÊÇ·ûºÏ±ê×¼µÄ¡£
[xmlns] Hack:
¸Õ¸ÕµÄ "* html" Hack ÊÇ IE6¼°ÒÔÏÂÖ§³Ö£¬ÆäËûä¯ÀÀÆ÷²»Ö§³Ö¡£ "[xmlns]" Hack ¸ÕºÃÏà·´¡£
[xmlns] #test { /*IE 6¼°ÒÔϲ»Ö§³Ö*/
color:green;
}
×¢Ò⣺Õâ¸ö Hack ÒªÇóHTML ±ØÐëÒªÓÐ< !DOCTYPE >Í·²¿ÒÔ¼°ÓÐxmlnsÊôÐԲŻáÆð×÷Óᣲ»¹ýÕâ¸öÎÊÌâËÆºõ²»´ó£¬ÏÖÔÚ¾ø´ó²¿·ÖÍøÒ³¶¼ÓÐÕâÁ½¸ö¶«¶«£¬°üÀ¨ Dreamweaver ĬÈÏн¨µÄÍøÒ³¶¼»á×Ô¶¯¼ÓÉÏ
Mac ÏÂ IE Hack:
/*\*//*/
#test {
color:blue;
}
/**/
¶þ) Õë¶Ô Gecko(Firefox, Netscape) µÄ Hack
@-moz-document url-prefix(){
#test {
color:yellow;
}
}
°üº¬ÔÚ @-moz-document url-prefix(){} Ö®¼äµÄ CSS Ö»ÓÐ Gecko Äں˵Ää¯ÀÀÆ÷²Å»áÖ§³Ö¡£ËùÒÔ¶ÔÓÚ Firefox ¿ÉÒÔÓÃÕâ¸ö Hack¡£
Èý) Õë¶Ô KHTML(Chrome, Safari), Opera µÄ Hack
@media screen and
Ïà¹ØÎĵµ£º
ÕâÆªÎÄÕÂÊÇÔÚÈçϵØÖ·¿´µ½µÄ£º
http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/CSS/Q_23302976.html
Ê×ÏÈÊÇHTML²¿·Ö£º
<
body>
<
div id="loading">
<div><img src="../images/loading.gif" /><span>Please Wait</span></div> ......
½ñÌì×öÒ»¸ö¹¦ÄÜ£¬¸ù¾ÝselectÔªËØÑ¡ÔñµÄ²»Í¬selectedIndexÏÏÔʾһ¸ö±í¸ñÀïÖ¸¶¨µÄtrÏî¡£
Ê×ÏÈ£º$("#table tr:gt(0)").css("display","none"); Õâ¸öûÎÊÌ⣬µ±ÒªÏÔʾµÄʱºò.css("display","block"),ÔÚFFÖв¼¾ÖһϾÍÂÒµôÁË¡£ÊÔÁ˼¸´Î¶¼ÊÇÈç´Ë£¬ÏëÁËһϣ¬ÊDz»ÊÇÔÚ ......
ÍøÉϹØÓÚÍ»³öÏÔʾµ±Ç°Ò³ÃæµÄÎÄÕÂÓв»ÉÙ£¬µ«ÊÇ»ù±¾¶¼ÊǹØÓÚʵÏÖ¾²Ì¬²Ëµ¥µÄ¸ßÁÁ£¬½²µ½¶¯Ì¬Éú³É²Ëµ¥¸ßÁÁµÄÎÄÕÂÖÁÉÙÎÒûÓÐÕÒµ½£¬ÔÚcsdnÉÏÎÊÁËÁ½Ì춼ûÓд𰸣¬×îºóÔÚһλÅóÓѵĻشðÖÐÕÒµ½Ë¼Â·£¬ÏÈÀûÓÃÒ»¸öº¯ÊýÅжϲ˵¥ÊÇ·ñÊÇÕýÔÚä¯ÀÀµÄµ±Ç°Ò³£¬È»ºó¸¶¸øliÒ»¸öid£¬ÀûÓÃcss²ãµþid´óÓÚclassµÄ¹ØÏµ£¬°ÑÕâ¸öid¶¨Òå³É¸ßÁÁÑùʽ¡£
aspx ......
css display µÄ²ÎÊýÁбí
Óï·¨£º
display : block | none | inline | compact | marker |
inline-table | list-item | run-in | table |table-caption |
table-cell | table-column | table-column-group |
table-footer-group | table-header-group | table-row | table-row-group
²ÎÊý£º
block : ¡¡CSS1¡¡¿é¶ ......
ת×Ô:http://www.boy110.com/csslimitedwidth/ CSSÏÞÖÆÍ¼Æ¬×î´ó¿í¶È£¬¼æÈÝIE6/IE7/IE8/FF£¬ÓÃ×ö¹ÜÀíºǫ́Ӧ¸ÃûÎÊÌ⣡ ÎÒÃÇÔÚÖÆ×÷Ò»¸öÍøÒ³µÄʱºò£¬¾³£Òª¶ÔÒ»¸öÇøÓòÀï¿ÉÄܳöÏÖµÄͼƬµÄ¿í¶È½øÐÐÏÞÖÆ£¬²»È»Ëü¿ÉÄÜ»á°ÑÒ³Ãæ³ÅµÃºÜÀúÜÀá£
Èç¹ûÄã²ÉÓù̶¨¿í¶È£¬³¤¶ÈÀ´ÉèÖõϰ£¬±ÈÈçÔÚ 200 ? "200px" : this.wid ......