Ò׽ؽØÍ¼Èí¼þ¡¢µ¥Îļþ¡¢Ãâ°²×°¡¢´¿ÂÌÉ«¡¢½ö160KB

CSSÖдæÔÚµÄBUG

1.divµÄ´¹Ö±¾ÓÖÐÎÊÌâ 
vertical-align:middle; 
½«ÐоàÔö¼Óµ½ºÍÕû¸öDIVÒ»Ñù¸ß line-height:200px; 
È»ºó²åÈëÎÄ×Ö£¬¾Í´¹Ö±¾ÓÖÐÁË¡£È±µãÊÇÒª¿ØÖÆÄÚÈݲ»Òª»»ÐС£
2. margin¼Ó±¶µÄÎÊÌâ     
ÉèÖÃΪfloatµÄdivÔÚieÏÂÉèÖõÄmargin»á¼Ó±¶¡£ÕâÊÇÒ»¸öie6¶¼´æÔÚµÄbug¡£
½â¾ö·½°¸ÊÇÔÚÕâ¸ödivÀïÃæ¼ÓÉÏdisplay:inline;    
ÀýÈ磺
<#div id=”imfloat”>    
ÏàÓ¦µÄcssΪ    
#IamFloat
{
float:left; margin:5px;/*IEÏÂÀí½âΪ10px*/ 
display:inline;/*IEÏÂÔÙÀí½âΪ5px*/
}  
3.¸¡¶¯ie²úÉúµÄË«±¶¾àÀë     
#box{
float:left; width:100px; margin:0 0 0 100px; //ÕâÖÖÇé¿öÖ®ÏÂIE»á²úÉú200pxµÄ¾àÀë display:inline; //ʹ¸¡¶¯ºöÂÔ

ÕâÀïϸ˵һÏÂblockÓëinlineÁ½¸öÔªËØ£º
blockÔªËØµÄÌØµãÊÇ,×ÜÊÇÔÚÐÂÐÐÉÏ¿ªÊ¼,¸ß¶È,¿í¶È,Ðиß,±ß¾à¶¼¿ÉÒÔ¿ØÖÆ(¿éÔªËØ);
InlineÔªËØµÄÌØµãÊÇ,ºÍÆäËûÔªËØÔÚͬһÐÐÉÏ,²»¿É¿ØÖÆ(ÄÚÇ¶ÔªËØ);    
#box

display:block; //¿ÉÒÔΪÄÚÇ¶ÔªËØÄ£ÄâΪ¿éÔªËØ 
display:inline; //ʵÏÖͬһÐÐÅÅÁеÄЧ¹û 
diplay:table; 
}
4 IEÓë¿í¶ÈºÍ¸ß¶ÈµÄÎÊÌâ
IE ²»ÈϵÃmin-Õâ¸ö¶¨Ò壬µ«Êµ¼ÊÉÏËü°ÑÕý³£µÄwidthºÍheightµ±×÷ÓÐminµÄÇé¿öÀ´Ê¹¡£ÕâÑùÎÊÌâ¾Í´óÁË£¬Èç¹ûÖ»Óÿí¶ÈºÍ¸ß¶È£¬Õý³£µÄä¯ÀÀÆ÷ÀïÕâÁ½¸öÖµ¾Í²»»á±ä£¬Èç¹ûÖ»ÓÃmin-widthºÍmin-heightµÄ»°£¬IEÏÂÃæ¸ù±¾µÈÓÚûÓÐÉèÖÿí¶ÈºÍ¸ß¶È¡£    
±ÈÈçÒªÉèÖñ³¾°Í¼Æ¬£¬Õâ¸ö¿í¶ÈÊDZȽÏÖØÒªµÄ¡£
Òª½â¾öÕâ¸öÎÊÌ⣬¿ÉÒÔÕâÑù£º    
#box{ width: 80px; height: 35px;}
html>body #box

width: auto; height: auto; min-width: 80px; min-height: 35px;
}
5.Ò³ÃæµÄ×îС¿í¶È    
min -widthÊǸö·Ç³£·½±ãµÄCSSÃüÁËü¿ÉÒÔÖ¸¶¨ÔªËØ×îСҲ²»ÄÜСÓÚij¸ö¿í¶È£¬ÕâÑù¾ÍÄܱ£Ö¤ÅŰæÒ»Ö±ÕýÈ·¡£µ«IE²»ÈϵÃÕâ¸ö£¬¶øËüʵ¼ÊÉϰÑwidthµ±×ö×îС¿í¶ÈÀ´Ê¹¡£ÎªÁËÈÃÕâÒ»ÃüÁîÔÚIEÉÏÒ²ÄÜÓ㬿ÉÒÔ°ÑÒ»¸ö<div> ·Åµ½ <body> ±êǩϣ¬È»ºóΪdivÖ¸¶¨Ò»¸öÀà, È»ºóCSSÕâÑùÉè¼Æ£º
#container{ min-width: 600px; width:e-xpression(document.body.clientWidth < 6


Ïà¹ØÎĵµ£º

JavaScript¶¯Ì¬¼ÓÔØCSSµÄÈýÖÖ·½·¨

  JavaScript¶¯Ì¬¼ÓÔØCSSµÄÈýÖÖ·½·¨ ÊÕ²Ø
Èç¹ûÄãÓÐºÜ¶à¹ØÁªµÄCSSÎļþÒªÒ»Æð¼ÓÔØ£¬»òÕßÏ붯̬µÄ¼ÓÔØ²»Í¬µÄCSSÎļþ£¬ÄÇôÏÂÃæµÄ·½·¨ÄãÒ»¶¨¶ÔÄãÓаïÖú¡£
µÚÒ»ÖÖ£ºÒ»°ãÓÃÔÚÍⲿCSSÎļþÖмÓÔØ±ØÐëµÄÎļþ
 ³ÌÐò´úÂë
@import url(style.css);
/*Ö»ÄÜÓÃÔÚCSSÎļþÖлòÕßstyle±êÇ©ÖÐ*/
µÚ¶þÖÖ£º¼òµ¥µÄÔÚÒ³ÃæÖмÓÔØÒ» ......

ÍøÒ³ÖÐÈçºÎ»»·ô£¿£¨CSS£©

×î¼òµ¥µÄ°ì·¨£º¼ÙÉèÄãÓÐÁ½¸öÑÕÉ«µÄCSSÎļþred.css,green.css,ĬÈÏΪºìÉ«µÄÑùʽ
<link rel="stylesheet" style="text/css" link="red.css" id="colorcss">
<input type="button" name="redcss" value='ºìÉ«' onclick="javascript:document.getElementById('colorcss').href='red.css'">
<input type="butt ......

³ÎÇåDIV+CSSÉè¼ÆµÄÎóÇø


µ±DIV+CSSƽµØÆð¾ªÀ×ͻȻ³öÏÖÔÚÍøÒ³Éè¼ÆÐÐÒµµÄʱºò£¬¹Ù·½¡¢Ãñ¼äÎÞ²»ÍƳ籸ÖÁ£¬·Â·ðTableÉè¼ÆµÄʱ´ú¾ÍÒªÖսᣬÂí
ÉϾÍÒª²½ÈëDIV+CSSµÄʱ´ú£¬²»¶®µÃDIV+CSSÄã¶¼²»ºÃÒâ˼˵Äã»áÍøÒ³Éè¼Æ£¬²»ÖªDIV+CSSÄã¶¼²»ºÃÒâ˼˵ÄãÊÇÕ¾³¤£¬Äã
Òª»¹ÊÇÓÃTABLEÀ´Éè¼ÆÕ¾µã£¬ÎÞÊý±ÉÒÄÖ®¹â¾ÍͶÉä¶øÀ´¡£
¡¡¡¡È»¶øDIV+CSSÕæµÄÓÐÕâôÉñÂð?¸ÃÔõà ......

JavaScript CSS StyleÊôÐÔ¶ÔÕÕ±í

JavaScript´úÂë
<mce:script type="text/javascript"><!--
function imageOver(e) {
e.style.border="1px solid red";
}
function imageOut(e) {
e.style.borderWidth=0;
}
// --></mce:script>
<img src="phplamp.gif" onmouseover="imageOver(this)" onmo ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØÍ¼ | ¸ÓICP±¸09004571ºÅ