IE6ÏÂcss¶¨ÒåDIV¸ß¶ÈµÄÎÊÌâ
IE6ÏÂĬÈϵÄ×ÖÌå³ß´ç´óÖÂÔÚ 12 – 14px Ö®¼ä£¬µ±ÄãÊÔͼ¶¨ÒåÒ»¸ö¸ß¶ÈСÓÚÕâ¸öĬÈÏÖµµÄ div µÄʱºò£¬ IE »á¹ÌÖ´µÄÈÏΪÕâ¸ö²ãµÄ¸ß¶È²»Ó¦¸ÃСÓÚ×ÖÌåµÄÐиߡ£ËùÒÔ¼´Ê¹ÄãÓà height:4px; À´¶¨ÒåÁËÒ»¸ö div µÄ¸ß¶È£¬Êµ¼ÊÔÚ IE ÏÂÏÔʾµÄÈÔÈ»ÊÇÒ»¸ö 12 px ×óÓҸ߶ȵIJ㡣Ìí¼Óoverflow: hidden½â¾öÎÊÌâ¡£
<div style=”height: 4px; overflow: hidden;”></div>
ÔÚIE6ÖУ¬Ê¹ÓÃCSS¶¨ÒåDIVµÄ¸ß¶ÈµÄʱºò¾³£Óöµ½Õâ¸öÎÊÌ⣬¾ÍÊǵ±DIVµÄ×îС¸ß¶ÈСÓÚÒ»¶¨µÄÖµÒԺ󣬾ͻᷢÏÖ£¬ÎÞÂÛÄãÔõôÉèÖÃ×îС¸ß¶È£¬DivµÄ¸ß¶È»á¹Ì¶¨ÔÚÒ»¸öÖµ²»ÔÙ·¢Éú±ä¶¯£¬Õâ¸öÎÊÌâºÜÊÇ·³ÈË¡£ÈçÏÂÃæµÄÇé¿ö¡£
HTML´úÂë
<html> <head> <title></title> <style type="text/css"> <!-- #testdiv { background: #009900; height: 3px; } --> </style> </head> <body> <div id="testdiv"></div> </body> </html>
ÕâÊÇÒòΪÔÚIE6ÖУ¬ÏµÍ³Ä¬ÈϵIJ¢·ÇÊÇDivÓÐÒ»¸öĬÈϵĸ߶ȣ¬¶øÊÇÄãûÓнâ¾öÒ»¸öÒþ²ØµÄ²ÎÊý£¬font-size£¬Õâ¸öÊÇie6ÖжÔÓÚDivÊôÐÔÖеÄfont-size´óСºÍÄãϵͳcssÖж¨ÒåµÄfont-sizeÓкܴó¹Øϵ£¬Òò´Ë±ØÐëµ¥¶À¶¨ÒåÕâ¸öDivµÄfont-size£¬ÕâÑù²ÅÄܽâ¾öÕâ¸öÎÊÌâ¡£¸ü¸ÄºóµÄ´úÂëÈçÏ¡£
HTML´úÂë
<html> <head> <title></title> <style type="text/css"> <!-- #testdiv { background: #009900; height: 3px; font-size: 0px; } --> </style> </head> <body> <div id="testdiv"></div> </body> </html>
Åöµ½ÕâÑùµÄÎÊÌâÓÐûÓÐÁîÄã¼°ÆäѹÒÖÄØ£¿¶øµ±¿´µ½ÉÏÃæµÄ½â¾ö°ì·¨Ê±£¬ÊDz»ÊÇÓеãÖØÉúµÄ¸Ð¾õ£¬»¹Óеãµã²ÔÁ¹ºÍ±ÉÊÓ¡£
Ïà¹ØÎĵµ£º
1¡¢CSSµÄÓï·¨ÊÇÕâÑùµÄ£ºselector {property: value}
selector-Ñ¡ÔñÆ÷£¨±ÈÈçbody¡¢div¡¢h2……£©
property-ÊôÐÔ £¨±ÈÈçbackground-color¡¢hidden¡¢text-align……£©
value-Öµ£¨±ÈÈçyellow¡¢blue¡¢12px¡¢center……£©
[×¢]£º
a¡¢³ýidÍâ´óСд²»Ãô¸Ð
b¡¢value´æÔÚ¶à¸öµ¥´Êʱ£¬ÒªÓÃÒ ......
CSS:
<style type="text/css">
a{
color: #FFFF99;
text-decoration: none;
}
a:hover{
color: #FFFFFF;
text-decoration: underline;
}
#nav{
padding: 10px 10px 0;
font-size: 12px;
font-weight: bold;
margin: 1em 0 0;
......
IE6¡¢IE7¡¢IE8¡¢FFä¯ÀÀÆ÷µÄCSS¼æÈÝÎÊÌ⣬±¾À´ie6¸úffÖ®¼äµÄ¼æÈÝÊǺÜÈÝÒ×½â¾öµÄ¡£¼ÓÉϸöie7»áÂé·³µã£¬ie8µÄ³öÏ־͸üÍ·ÌÛÁË£¬ÔÀ´hack ie7µÄ·½·¨ÓÖ²»ÄÜÓÃÁË£¬Ôõô°ìÄØ£¿
»¹ºÃ£¬Î¢ÈíÌṩÁËÕâÑùÒ»¸ö´úÂ룺 °ÑÕâ¶Î´úÂë·Åµ½ÀïÃ棬ÔÚie8ÀïÃæµÄÒ³Ãæ½âÎöÆðÀ´¾Í¸úie7һģһÑùµÄÁË£¬ËùÒÔ£¬»ù±¾ÉÏ¿ÉÒÔÎÞÊÓie8£¬Ê£ÏµĴúÂëÖ»ÐèÒªÕâÑùд¾ ......