DIV CSSÍøÒ³²¼¾Ö¼æÈÝÐÔµÄÒªµãÓë¾÷ÇÏ×Ü
IE vs FF
CSS ¼æÈÝÒªµã£ºDOCTYPE Ó°Ïì CSS ´¦Àí
FF: div ÉèÖà margin-left, margin-right Ϊ auto ʱÒѾ¾ÓÖÐ, IE ²»ÐÐ
FF: body ÉèÖà text-align ʱ, div ÐèÒªÉèÖà margin: auto(Ö÷ÒªÊÇ margin-left,margin-right) ·½¿É¾ÓÖÐ
FF: ÉèÖà padding ºó, div »áÔö¼Ó height ºÍ width, µ« IE ²»»á, ¹ÊÐèÒªÓà !important ¶àÉèÒ»¸ö height ºÍ width
FF: Ö§³Ö !important, IE ÔòºöÂÔ, ¿ÉÓà !important Ϊ FF ÌØ±ðÉèÖÃÑùʽ
div µÄ´¹Ö±¾ÓÖÐÎÊÌâ: vertical-align:middle; ½«ÐоàÔö¼Óµ½ºÍÕû¸öDIVÒ»Ñù¸ß line-height:200px; È»ºó²åÈëÎÄ×Ö£¬¾Í´¹Ö±¾ÓÖÐÁË¡£È±µãÊÇÒª¿ØÖÆÄÚÈݲ»Òª»»ÐÐ
cursor: pointer ¿ÉÒÔͬʱÔÚ IE FF ÖÐÏÔʾÓαêÊÖָ״£¬ hand ½ö IE ¿ÉÒÔ
FF: Á´½Ó¼Ó±ß¿òºÍ±³¾°É«£¬ÐèÉèÖà display: block, ͬʱÉèÖà float: left ±£Ö¤²»»»ÐС£²ÎÕÕ menubar, ¸ø a ºÍ menubar ÉèÖø߶ÈÊÇΪÁ˱ÜÃâµ×±ßÏÔʾ´íλ, Èô²»Éè height, ¿ÉÒÔÔÚ menubar ÖвåÈëÒ»¸ö¿Õ¸ñXHTML+CSS¼æÈÝÐÔ½â¾ö·½°¸Ð¡¼¯
ʹÓÃXHTML+CSS¹¹¼ÜºÃ´¦²»ÉÙ£¬µ«Ò²È·Êµ´æÔÚһЩÎÊÌ⣬²»ÂÛÊÇÒòΪʹÓò»ÊìÁ·»¹ÊÇ˼·²»ÇåÎú£¬ÎÒ¾ÍÏȰÑһЩÎÒÓöµ½µÄÎÊÌâдÔÚÏÂÃæ¡£
1.ÔÚmozilla firefoxºÍIEÖеÄBOXÄ£ÐͽâÊͲ»Ò»Öµ¼ÖÂÏà²î2px½â¾ö·½·¨£º
div{margin:30px!important;margin:28px;}
×¢ÒâÕâÁ½¸ömarginµÄ˳ÐòÒ»¶¨²»ÄÜд·´£¬!importantÕâ¸öÊôÐÔIE²»ÄÜʶ±ð£¬µ«±ðµÄä¯ÀÀÆ÷¿ÉÒÔʶ±ð¡£ËùÒÔÔÚIEÏÂÆäʵ½âÊͳÉÕâÑù£º
div{maring:30px;margin:28px}
ÖØ¸´¶¨ÒåµÄ»°°´ÕÕ×îºóÒ»¸öÀ´Ö´ÐУ¬ËùÒÔ²»¿ÉÒÔֻдmargin:XXpx!important;
2.IE5 ºÍIE6µÄBOX½âÊͲ»Ò»ÖÂIE5ÏÂdiv{width:300px;margin:0 10px 0 10px;}divµÄ¿í¶È»á±»½âÊÍΪ300px-10px(ÓÒÌî³ä)-10px(×óÌî³ä)×îÖÕdivµÄ¿í¶ÈΪ280px£¬¶øÔÚIE6ºÍÆäËûä¯ÀÀÆ÷ÉÏ¿í¶ÈÔò ÊÇÒÔ300px+10px(ÓÒÌî³ä)+10px(×óÌî³ä)=320pxÀ´¼ÆËãµÄ¡£ÕâʱÎÒÃÇ¿ÉÒÔ×öÈçÏÂÐ޸ģº
div{width:300px!important;width /**/:340px;margin:0 10px 0 10px}
¹ØÓÚÕâ¸ö/**/ÊÇʲôÎÒÒ²²»Ì«Ã÷°×£¬Ö»ÖªµÀIE5ºÍfirefox¶¼Ö§³Öµ«IE6²»Ö§³Ö£¬Èç¹ûÓÐÈËÀí½âµÄ»°£¬Çë¸æËßÎÒÒ»Éù£¬Ð»ÁË£¡£º£©
3.ul±êÇ©ÔÚMozillaÖÐĬÈÏÊÇÓÐpaddingÖµµÄ,¶øÔÚIEÖÐÖ»ÓÐmarginÓÐÖµËùÒÔÏȶ¨Òå
ul{margin:0;padding:0;}
¾ÍÄܽâ¾ö´ó²¿·ÖÎÊÌâ
4.¹ØÓڽű¾£¬ÔÚxhtml1.1Öв»Ö§³ÖlanguageÊôÐÔ£¬Ö»ÐèÒª°Ñ´úÂë¸ÄΪ
<script type="text/javascript">¾Í¿ÉÒÔÁË
Ïà¹ØÎĵµ£º
Èç¹ûÄã²»×ÜÊÇÓà Windows
É쵀 Internet
Explorer
À´ÉÏÍøµÄ»°£¬Äã¿ÉÄÜ»á×¢Òâµ½£¬Ðí¶àÍøÕ¾ÉϵÄÊÓÆµµã²¥Ö®ÀàµÄ¶àýÌåÄÚÈÝ£¬ÄãÎÞ·¨Ö±½ÓÔÚ Internet Explorer
ÒÔÍâµÄÆäËüä¯ÀÀÆ÷Öйۿ´£¬±ÈÈçÃ÷Ã÷ÒѾ°²×°
Á˲å¼þÈ´ÌáʾȱÉÙ²å¼þ£¬»òÕßʲô¶¼²»Ìáʾ³öÏֿյĿò¿ò£¬»òÕßÏÔ
ʾÁ˲¥·ÅÆ÷²å¼þȴʼÖÕÁ¬²»ÉÏ´ò²»¿ªÖ®ÀàµÄÎÊÌ⣠......
ÔÚÕâÖÖä¯ÀÀÆ÷ÏÂÏÔʾÕý³££¬ÔÚÁíÒ»ÖÖϾÍÂÒÁË£¬ÎÒÃÇÔÚ±àдCSSµÄʱºò»áºÜÄջ𣬸ÕÐÞ¸´ÁËÕâ¸öä¯ÀÀÆ÷µÄÎÊÌ⣬½á¹ûÁíÍâÒ»¸öä¯ÀÀÆ÷È´³öÁËÐÂÎÊÌâ¡£
-
ʲôÊÇä¯ÀÀÆ÷¼æÈÝ£ºµ±ÎÒÃÇʹÓò»Í¬µÄä¯ÀÀÆ÷£¨Firefox IE7
IE6£©·ÃÎÊͬһ¸öÍøÕ¾£¬»òÕßÒ³ÃæµÄʱºò£¬»á³öÏÖһЩ²»¼æÈݵÄÎÊÌ⣬ÔÚÕâÖÖä¯ÀÀÆ÷ÏÂÏÔʾÕý³£ ......
/**
* 給結點Ìí¼Ó濾鏡
* 1.filterStyleÐÎʽ£ºÂ˾µÃû³Æ¼°ÆäºóµÄ²¿·Ö
* 2.Alpha Â˾µ£ºALPHA(opacity=opacity,finishopacity=finishopacity,style=style,startx=startx, starty=starty,finishx=finishx,finishy=finishy)}--͸Ã÷
* 3.Blur Â˾µ£ºBlur(add=add,direction=direct ......
½ñÌìÓöµ½Òª×öCSSʵÏֲ˵¥Ô²½Ç±³¾°µÄЧ¹û, ËùÒÔÔÚÍøÉÏËÑÁËһϣ¬·¢ÏÖ´Ë·½·¨×î¼òµ¥¿ÉÐÐ~~ÌØ¼Ç¼ÏÂÀ´¹©´ó¼ÒÒ»ÆðʹÓÃ~~~
.nav ul li a{float:left; display:block; padding: 0 10px;
} /*×¢Òâpadding*/
.nav ul li a:hover{padding:0 0 0 10px;
display:block; background:url(images/tableft1.jpg) left top no-repeat # ......
ÓÃCSSÈÃÔªËØ¾ÓÖÐÏÔʾ²¢²»ÊǼþºÜ¼òµ¥µÄÊÂÇé—ͬÑùµÄºÏ·¨CSS¾ÓÖÐÉèÖÃÔÚ²»Í¬ä¯ÀÀÆ÷ÖеıíÏÖÐÐΪȴ¸÷ÓÐǧÇï¡£ÈÃÎÒÃÇÏÈÀ´¿´Ò»ÏÂCSSÖг£¼ûµÄ¼¸ÖÖÈÃÔªËØË®Æ½¾ÓÖÐÏÔʾµÄ·½·¨¡£
¡¡¡¡1.ʹÓÃ×Ô¶¯Íâ±ß¾àʵÏÖ¾ÓÖÐ
¡¡¡¡CSSÖÐÊ×Ñ¡µÄÈÃÔªËØË®Æ½¾ÓÖеķ½·¨¾ÍÊÇʹÓÃmarginÊôÐÔ—½«ÔªËصÄmargin-leftºÍmargin-rightÊôÐÔÉèÖÃΪ
aut ......