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

10¸öCSS¼òд¼¼ÇÉÈÃÄãÓÀÔ¶ÊÜÓÃ

¡¡¡¡CSS¼òд
¾ÍÊÇÖ¸½«¶àÐеÄCSSÊôÐÔÉùÃ÷»¯³ÉÒ»ÐУ¬ÓÖ³ÆÎªCSS
´úÂëÓÅ»¯
¡£CSS¼òдµÄ×î´óºÃ´¦¾ÍÊÇÄܹ»ÏÔÖø¼õÉÙCSSÎļþµÄ´óС£¬Æäʵ»¹ÓкܶàÆäËûÒæ´¦¡£Ó·Ö×¶øÔÓÂÒµÄCSSÑùʽ±í»áʹÄãÓöµ½ÎÊÌâÊÇÄÑÒÔµ÷ÊÔ¡£ÓÈÆäÊǵ±Ò»¸öÍŶÓÔÚ½øÐÐÉè¼ÆµÄʱºò£¬ÄãµÄÓ·Ö×µÄCSS´úÂë»áʹÄãµÄÍŶӯäËû³ÉÔ±µÄ¹¤×÷ЧÂÊϽµ¡£
¡¡¡¡Ì«¶àµÄÈËʹÓÃDreamweaverÕâÖÖËù¼û¼´ËùµÃÈí¼þÀ´±àдCSS£¬Ê¹µÃ´úÂë¹ýÓÚÓ·Öס£²»¹ýû¹ØÏµ£¬¿´¹ý±¾ÎÄÖ®ºó£¬ÄãÒ»ÄÜÄÜÕÆÎÕCSS´úÂëÓÅ»¯µÄ¼¼ÇÉ£¬½ñºóÈÃÄãµÄÿһ¸öCSSÑùʽ±í¶¼¿´ÆðÀ´Õû½à¶ø¼ò¶Ì°É¡£
1. ÊôÐÔֵΪ0
ÊéдԭÔòÊÇÈç¹ûCSSÊôÐÔֵΪ0£¬ÄÇôÄã²»±ØÎªÆäÌí¼Óµ¥Î»(Èç:px/em)£¬Äã¿ÉÄÜ»áÕâÑùд:
padding: 10px 5px 0px 0px;
ÊÔÊÔÕâÑù°É:
padding: 10px 5px 0 0;
2. ÒÆ³ýÑ¡ÔñÆ÷
¡¡¡¡Ñ¡ÔñÆ÷ÊÇÄãÔÚÎªÒ»Ð©ÔªËØÓ¦ÓÃCSSÑùʽʱµÄ»ù±¾·½·¨£¬±ÈÈçh1, h2, h2, div, strong, pre, ul, olµÈµÈ…Èç¹ûÄãʹÓÃÁËclass(.ÀàÃû)»òID(#idÃû),ÄÇô¾Í²»ÓÃÔÙÔÚÉùÃ÷CSSʱ°üº¬Ñ¡ÔñÆ÷ÁË¡£
div#logowrap
³¢ÊÔÈÓµô¶àÓàµÄÑ¡ÔñÆ÷°É:
#logowrap
ÔÚÕâ¸öÀý×ÓÖÐËùνµÄÄǸöÑ¡ÔñÆ÷¾ÍÊÇdiv
3. *×ܰ®ºÍÄã¿ªÍæÐ¦
¡¡¡¡ÒªÃ÷ÖǵÄʹÓÃ*
¶ø±ÜÃâËüÔÚÕû¸öCSSÑùʽ±íÖÐÂÒ¿ªÍæÐ¦£¬*
ÊǸöͨÅä·û£¬Äã¿ÉÒÔʹÓÃËüÀ´ÎªÄãµÄÉè¼Æ²¿·Ö»òÈ«²¿½øÐÐһϵÁÐCSSÉùÃ÷¡£ÀýÈç:
* {
    margin: 0;
}
Õâ¸öÉùÃ÷»á½«ËùÓÐÔªËØµÄmarginÖµÉèÖÃΪ0£¬Í¬ÑùµÄ£¬ÎªÁËÑϽ÷Æð¼û£¬Äã¿ÉÒÔ³¢ÊÔÕâÑùÉèÖÃ:
#menu * {
    margin: 0;
}
ÕâÑùµÄÉùÃ÷ÊÇÖ¸½«#menuϵÄËùÓÐÔªËØµÄmarginÉèΪ0¡£
4. ±³¾°
¡¡¡¡±³¾°(background)ÊôÐÔ¿ÉÄÜ»á°üº¬ÉèÖñ³¾°É«¡¢±³¾°Í¼¡¢±³¾°Í¼µÄλÖúͱ³¾°Í¼Öظ´·½Ê½µÄ²ÎÊý£¬Äã¿ÉÄÜ»áд³É:
background-image: url(“logo.png”);
background-position: top center;
background-repeat: no-repeat;
Æäʵ¿ÉÒÔд³É:
background: url(logo.png) no-repeat top center;
5. ÑÕÉ«
¡¡¡¡ÑÕÉ«(color)ÊôÐÔÔÚCSSͨ³£Ö¸¶¨ÎªÒ»¸öÊ®Áù½øÖƵÄÖµ,Ò»¸ö#¼Ó6λÊý£¬ËûµÄ¼òд·½Ê½ÊÇÈç¹ûÑÕɫֵÓɳɶԶù³öÏÖµÄÈý¶Ô¶øÊý×Ö×é³É£¬Äã¿ÉÒÔÊ¡ÂÔµôû¶ÔÖеÄÒ»¸öÊý×Ö¡£
¡¡¡¡#000000 ¿ÉÒÔд³É #000, #336699 ¿ÉÒÔд³É #369
¡¡¡¡ÕâÖÖ¼òд¼¼ÇÉÖ»ÊÊÓÃÓڳɶԳöÏÖµÄÑÕɫֵ£¬ÆäËüÑÕɫֵ²»ÊÊÓÃÕâÖÖ¼¼ÇÉ£¬±ÈÈç:
¡¡¡¡#010101, #223345, #FFF000
6. Margin(Íâ±ß¾à/¿Õ°×±ß)
ÉùÃ÷CSS maginÖµµÃʱºòͨ³£»áд³ÉÕâÑù:
margin-top:0px;
margin-right:10px;


Ïà¹ØÎĵµ£º

css¼æÈÝIE8


<meta http-equiv="x-ua-compatible" content="ie=7" />
IE6¡¢IE7¡¢FirefoxµÈä¯ÀÀÆ÷µÄ¼æÈÝÐÔÎÊÌâÈÃÍøÒ³Éè¼ÆÊ¦ÃÇ´óÉËÄԽ±¾À´ÍøÒ³Éè¼ÆÊǼþºÜÓÐȤµÄÊÂÇ飬µ«ÊÇÈ´±»Õâ¶àÓà¼æÈݹ¤×÷ÉËÄÔ½î£¬ÌØ±ðÊÇÈÃÈËÍÙÆúµÄIE6£¬¶àÉÙÈËÏëÈÃËüÏûʧ£¬¿ÉÊÇËü¾ÍÊÇÏûʧ²»ÁË£¬Î¢Èí»¹Ëµ²»»áÍ£Ö¹¶ÔIE6£¬Õæ¹»ÓôÃÆµÄ¡£
   &n ......

CSSËټǿھ÷

Èç¹ûÔÚÓÃCSSÉè¼Æ²¼¾ÖʱÓöµ½BUG£¬ÇëÈÏÕæÔĶÁÒÔÏÂÄÚÈÝ£¬·Ç³£ÈÝÒ×¼ÇÒäµÄ£¬²»ÖªµÀÄÄλ¸ßÈ˰ÑCSS BUG±à³ÉÁË˳¿ÚÁïÁË£¡¿´¿´ºÃ²»ºÃ¼ÇסĨ£¿ Ò»¡¢IE±ß¿òÈôÏÔÈôÎÞ£¬Ðë×¢Ò⣬¶¨ÊǸ߶ÈÉèÖÃÒÑÍü¼Ç£» ¶þ¡¢¸¡¶¯²úÉúÓÐÔµ¹Ê£¬ÈôÒª¸¸²ã°üº¬×¡£¬½ô¸ú¸¡¶¯ÒªÇå³ý£¬
Èç¹ûÔÚÓÃCSSÉè¼Æ²¼¾ÖʱÓöµ½BUG£¬ÇëÈÏÕæÔĶÁÒÔÏÂÄÚÈÝ£¬·Ç³£ÈÝÒ×¼ÇÒäµÄ£¬²»ÖªµÀÄ ......

JavaScript CSS StyleÊôÐԲο¼

CSSÓï·¨ (²»Çø·Ö´óСд) ¡¡¡¡JavaScriptÓï·¨ (Çø·Ö´óСд)
border ¡¡¡¡border
border-bottom ¡¡¡¡borderBottom
border-bottom-color ¡¡¡¡borderBottomColor
border-bottom-style¡¡¡¡ borderBottomStyle
border-bottom-width ¡¡¡¡borderBottomWidth
border-color ¡¡¡¡borderColor
border-left ¡¡¡¡borderLeft ......

IEÓëFirefoxµÄCSS¼æÈÝ´óÈ«

»¹Ëã²»´íµÄÎÄÕ£¬ËäÈ»ÌõÀíÐÔ²»ÊǷdz£Çå³þ£¬Ò²×ªÌùÊÕÁ˰ɣ¬·½±ã²é×ÊÁÏ¡£
    CSS¶Ôä¯ÀÀÆ÷Æ÷µÄ¼æÈÝÐÔ¾ßÓкܸߵļÛÖµ£¬Í¨³£Çé¿öÏÂIEºÍFirefox´æÔںܴóµÄ½âÎö²îÒ죬ÕâÀï½éÉÜһϼæÈÝÒªµã¡£
¡¡¡¡³£¼û¼æÈÝÎÊÌ⣺
¡¡¡¡1.DOCTYPE Ó°Ïì CSS
´¦Àí
¡¡¡¡2.FF: div ÉèÖà margin-left, margin-right Ϊ auto ʱÒѾ­ ......

CSSä¯ÀÀÆ÷¼æÈÝÎÊÌâÕûÀí

´ÓÍøÉÏÊÕ¼¯ÁËIE7,6ÓëFireofxµÄ¼æÈÝÐÔ´¦Àí·½·¨²¢ÕûÀíÁËÒ»ÏÂ.¶ÔÓÚweb2.0µÄ¹ý¶È,Ç뾡Á¿ÓÃxhtml¸ñʽд´úÂë,¶øÇÒDOCTYPE Ó°Ïì CSS ´¦Àí,×÷ΪW3CµÄ±ê×¼,Ò»¶¨Òª¼Ó DOCTYPEÉùÃû.
CSS¼¼ÇÉ
1.divµÄ´¹Ö±¾ÓÖÐÎÊÌâ vertical-align:middle; ½«ÐоàÔö¼Óµ½ºÍÕû¸öDIVÒ»Ñù¸ß line-height:200px; È»ºó²åÈëÎÄ×Ö£¬¾Í´¹Ö±¾ÓÖÐÁË¡£È±µãÊÇÒª¿ØÖÆÄÚ ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØÍ¼ | ¸ÓICP±¸09004571ºÅ