Ò׽ؽØÍ¼Èí¼þ¡¢µ¥Îļþ¡¢Ãâ°²×°¡¢´¿ÂÌÉ«¡¢½ö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;


Ïà¹ØÎĵµ£º

ASP.NET ½« CSS ºÍÑùʽÓÃÓÚ Menu ¿Ø¼þ


      ¼¸ºõ Menu ¿Ø¼þÍâ¹ÛµÄ¸÷¸ö·½Ãæ¶¼¿ÉÒÔʹÓà Menu ¿Ø¼þµÄÊôÐÔ»ò¼¶ÁªÑùʽ±í (CSS) À´¹ÜÀí¡£Í¨¹ýÁ˽âÄÄЩÊôÐÔ¿ØÖƳÊÏÖµÄÄÄЩ·½Ã棬¿ÉÒÔ¶¨ÖƲ˵¥µÄÍâ¹Û¡£±¾Ö÷Ìâ½éÉÜÓÉ Menu ¿Ø¼þ¹«¿ªµÄÑùʽÀàÐÍ£¬²¢½¨ÒéһЩʹÓà Menu ¿Ø¼þÉèÖÃÑùʽµÄ×î¼Ñ×ö·¨¡£
¿ÉÒÔÖ±½ÓÔÚ±ê¼ÇÖÐÉèÖø÷ÖÖÑùʽµÄÊôÐÔ»òʹÓÃÑùʽ±í ......

Internet Explorer CSS hacks

²âÊÔ»·¾³£ºIE6 , IE7, IE8, FF3.0 
±í´ï·½Ê½£º±í´ï·½Ê½£º 
body { `background:red } 
body { ~background:red } 
body { !background:red } 
body { @background:red } 
body { #background:red } 
body { $background:red } 
body { %background:red } 
body { ^b ......

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 ......

CSSÖÐpositionµÄabsoluteºÍrelativeµÄÓ¦ÓÃ

positionÊôÐÔÆäʵÊÇÖ¸±¾Ìå¶ÔÉϼ¶µÄ¶¨Î»¡£Èç¹ûÕâôÀí½â£¬¾ÍºÃ°ìÁË¡£
ĬÈϵÄÊôÐÔÖµ¶¼ÊÇstatic£¬¾²Ì¬¡£¾Í²»Óöà˵ÁË¡£×î¹Ø¼üµÄÊÇ
relative£¨Ïà¶Ô£©ÒÔ¼°absolute£¨¾ø¶Ô£©¡£
ÍùÍùÎÒÃÇÈç¹ûÊÇCOPY±ðÈ˵ĴúÂ룬»á°ÑabsoluteÊôÐÔÓëleft¡¢topÅäºÏÆðÀ´ÖÆ×÷Ïà¹ØµÄ“Ðü¸¡²ã”Ч¹û¡£È»¶øÓÐʱºòÎÒÃÇÐèÒªÕë¶Ôijһ¸öÈÝÆ÷µÄÐü¸¡Ð ......

15¸öCSS³£ÓÃ֪ʶ

ÉùÃ÷£º±¾ÎÄת×Ôwww.52css.com
1¡¢²»ÒªÊ¹ÓùýСµÄͼƬ×ö±³¾°Æ½ÆÌ¡£Õâ¾ÍÊÇΪºÎºÜ¶àÈ˶¼²»Óà1px µÄÔ­Òò£¬Õâ²ÅÖªÏþ¡£¿í¸ß 1px µÄͼƬƽÆÌ³öÒ»¸ö¿í¸ß 200px µÄÇøÓò£¬ÐèÒª 200*200=40, 000 ´Î£¬Õ¼ÓÃ×ÊÔ´¡£ 
2¡¢Îޱ߿ò¡£ÍƼöµÄд·¨ÊÇ border:none;£¬¹þ¹þ£¬ÎÒÒ»Ö±ÔÚÓà ......
© 2009 ej38.com All Rights Reserved. ¹ØÓÚE½¡ÍøÁªÏµÎÒÃÇ | Õ¾µãµØÍ¼ | ¸ÓICP±¸09004571ºÅ