¸÷ä¯ÀÀÆ÷רÊôCSS HACK:FIREFOX/OPERA/SAFARI/IE
CSS Hack ÊÇÔÚ±ê×¼ CSS û°ì·¨¼æÈݸ÷ä¯ÀÀÆ÷ÏÔʾЧ¹ûʱ²Å»áÓÃÉϵIJ¹¾È·½·¨,ÔÚ¸÷ä¯ÀÀÆ÷³§É̽âÎö CSS ûÓдï³ÉÒ»ÖÂǰ,ÎÒÃÇÖ»ÄÜÓÃÕâÑùµÄ·½·¨À´Íê³ÉÕâÑùµÄÈÎÎñ¡£ÍøÉÏÄã¿ÉÄÜÄÜËÑË÷µ½Ò»´ó¶ÑµÄ CSS Hack£¬µ«ÊÇÎÒ½ñÌì·¢²¼µÄÄã¿ÉÄܲ¢²»¶¼ºÜÁ˽⣬ÒòΪÕâЩ¶¼ÊÇÖ»Õë¶Ôµ¥¶ÀÒ»¸öä¯ÀÀÆ÷µÄ CSS Hack¡£
ΪÁËÏòÄãչʾÕâЩ CSS Hack ÊÇ·ñÕý³£ÔË×÷£¬ÎÒн¨Áù¸ö P ±êÇ©£¬²¢¸øÃ¿Ò»¸ö P ±êǩһ¸öÌØÓÐµÄ id¡£Õ⽫ÏòÄãչʾ CSS Hack µÄÔË×÷Çé¿ö¡£
<p id="opera">ÎÒÀ´×Ô Opera 7.2 - 9.5</p>
<p id="safari">ÎÒÊÇÉñÆæµÄ Safari</p>
<p id="firefox">ÎÒÀ´×Ô Firefox</p>
<p id="firefox12">ÎÒÊÇÄãÒ¯Ò¯ Firefox 1 - 2 </p>
<p id="ie7">ÎÒÊÇ囧 IE 7</p>
<p id="ie6">ÎÒÊÇÄÔȳ IE 6</p>
È»ºóÎÒÈÃÕâЩ P ±êǩĬÈ϶¼²»ÏÔʾ
<style type="text/css">
body p{display: none;}
</style>
ʹÓà IE CSS Ìõ¼þ×¢ÊÍÇø·Ö IE ä¯ÀÀÆ÷
×î¼òµ¥µÄÇø·Ö IE ä¯ÀÀÆ÷µÄ·½·¨×ÔÈ»ÊÇʹÓÃËûÃǵÄÌõ¼þ×¢ÊÍ¡£ ΢Èí´´½¨ÁËÒ»¸öÇ¿´óµÄÓï·¨À´ÈÃÎÒÃÇȥʵÏÖÕâ¸ö¹¦ÄÜ¡£ÎÒ²»ÏëÔÙÏêϸµØ½éÉÜ IE Ìõ¼þ×¢ÊÍÁË£¬ÎÒÏëÄãÔÚËÑË÷ÒýÇæÄÜËÑË÷µ½ÉÏÍò¸öËÑË÷ÌõÄ¿£¬ÎÒÕâÀïÖ»ÒªÕâÁ½¸ö:
<!--[if IE 7]>
<style type="text/css">
</style>
<![endif]-->
<!--[if IE 6]>
<style type="text/css">
</style>
<![endif]-->
ʹÓà CSS ½âÎöÆ÷ Hacks Çø·Ö IE
Ëä˵ IE Ìõ¼þ×¢ÊÍÊ®·Ö¼òµ¥ºÃÓ㬵«ÊÇÈç¹ûÄãÏë°ÑÈ«²¿µÄ CSS ·Åµ½Ò»¸öÎļþÀïµÄ»°£¬ÄÇôÄã²»µÃ²»Ê¹ÓñðµÄ·½·¨¡£×¢ÒâÕâÀïµÄ IE 7 Hack½«Ö»¶Ô IE7 ÓÐЧ£¬ÒòΪ IE6 ¸ù±¾²»ÖªµÀ > Ñ¡Ôñ·û¡£Í¬Ê±ÄãÒ²µÃ×¢Òâ > Ñ¡Ôñ·û¶ÔÓÚÆäËûä¯ÀÀÆ÷ͬÑùÊÇÎÞЧµÄ¡£
/* IE 7 */
html > body #ie7
{*display: block;}
/* IE 6 */
body #ie6
{_display: block;}
CSS Hack Çø·Ö Firefox
µÚÒ»¸öʹÓÃÁË body:empty À´Çø·Ö Firefox 1 ºÍ 2 ¡£µÚ¶þ¸ö hackʹÓÃÁËÈ«²¿ Firefox ä¯ÀÀÆ÷µÄרÓÐÀ©Õ¹ -moz¡£ -moz Ö»¶Ô FirefoxÓÐЧ£¬Ê¹ÓÃÕâ¸ö Hack ´ó¿É²»±Øµ£ÐÄÆäËûä¯ÀÀÆ÷µÄÓ°Ïì¡£
/* Firefox 1 - 2 */
body:empty #firefox12
{display: block;}
/* Firefox */
@-moz-document url-prefix()
{#firefox { display: block; }}
CSS Hack Çø·Ö Safari
Safari µÄ CSS hack Óë Firefox µÄ hack ¿´ÆðÀ´ºÜÏñ£¬Ê¹ÓõÄÊÇ Safariä¯ÀÀÆ÷µÄ
Ïà¹ØÎĵµ£º
°´Å¥Ñùʽ*/
.ButtonCss {}{
font-family: "Tahoma", "ËÎÌå";
font-size:9pt; color: #003399;
border: 1px #003399 solid;
color:006699;
BORDER-BOTTOM: #93bee2 1px solid;
BORDER-LEFT: #9 ......
дÁËÒ»¸ö±íµ¥£¬ÔÚʹÓÃcssʱ·¢ÏÖÁËһЩÎÊÌâ¡£
1¡¢¶¨ÒålabelµÄstyle²»Æð×÷Óã¬ÀýÈ磬ÎÒÔÚcssÖж¨ÒåÁËÒ»¸ö
<mce:style type="text/css"><!--
label
{
font-size:large;
}
--></mce:style><style type="text/css" ......
CSS´úÂë
<style>
body{
background-color:#f4f4f4;
font-size:12px;
}
div.test{
width:200px;
height:100px;
border:1px solid red;
border-top:4px solid red;
padding:10px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
</style>
HTML´úÂë
<div class="test"&g ......
¶ÔÓÚÒþ²ØÎÄ×Ö & ÄÚÈÝ£¬ÍøÉÏÒÑÓв»ÉÙCSS·½·¨¿ÉÒÔʵÏÖ£¬ÏÖ×ܽἸÌõʵÓõÄÒþ²ØÐ§¹ûÈçÏ£º
¼ÙÈçÐèÒªÒþ²ØµÄ¶ÔÏóÊÇ£º
<h1 id="header"><span class="texthidden">this text need to be hidden.</span></h1>
Òþ²ØÕâÒ»²¿·ÖµÄcss·½·¨Ò»°ãÓÐÁùÖÖ£º
1¡¢display:none;
/* Ëü¿ÉÒÔʹ°üÀ¨ÈÝÆ÷± ......
_property:value
ÊôÐÔǰ¼Ó_Ïß,¸Ãhack¶ÔIEÓÐЧ£¬ÔÚFFÏÂÎÞЧ
Õâ¶Î´úÂëÔÚIEÏ¿´,divµÄ±ß¿òΪÀ¶É«,¶øÔÚFireFoxÏÂÎÞЧ
<style type="text/css">
.tx_border{_border:1px solid #333333;}/*Õâ¸öÔÚIEÏ¿ÉÒÔ¿´µ½±ß¿òΪ»ÒÉ«£¬¶øÔÚFFÏÂÊÇûÓÐÈκεÄЧ¹û*/
</style>
Ñ¡Ôñ·û {width:IE5.x¿í¶È; voice-family :"\"}\"" ......