CSSÑùʽÎļþÓÅ»¯ ¸üÕû½à¶øÇåÎú
CSS¼òд¾ÍÊÇÖ¸½«¶àÐеÄCSSÊôÐÔÉùÃ÷»¯³ÉÒ»ÐУ¬ÓÖ³ÆΪCSS´úÂëÓÅ»¯¡£CSS¼òдµÄ×î´óºÃ´¦¾ÍÊÇÄܹ»ÏÔ׿õÉÙCSSÎļþµÄ
´óС£¬Æäʵ»¹ÓкܶàÆäËûÒæ´¦¡£Ó·Ö׶øÔÓÂÒµÄCSSÑùʽ±í»áʹÄãÓöµ½ÎÊÌâÊÇÄÑÒÔµ÷ÊÔ¡£ÓÈÆäÊǵ±Ò»¸öÍŶÓÔÚ½øÐÐÉè¼ÆµÄ
ʱºò£¬ÄãµÄÓ·Ö×µÄCSS´úÂë»áʹÄãµÄÍŶÓÆäËû³ÉÔ±µÄ¹¤×÷ЧÂÊϽµ¡£
¡¡¡¡½ñÌ죬ÕûÀíÁËһЩCSS¼òд¼¼ÇÉ£¬ËüÃÇÆäʵÊÇCSS×î³£ÓõÄд·¨£¬µ«ÊÇÌ«¶àµÄÈËʹÓÃDreamweaverÕâÖÖËù¼û¼´ËùµÃÈí
¼þÀ´±àдCSS£¬Ê¹µÃ´úÂë¹ýÓÚÓ·Öס£²»¹ýû¹Øϵ£¬¿´¹ý±¾ÎÄÖ®ºó£¬ÄãÒ»ÄÜÄÜÕÆÎÕCSS´úÂëÓÅ»¯µÄ¼¼ÇÉ£¬½ñºóÈÃÄãµÄÿһ¸ö
CSSÑùʽ±í¶¼¿´ÆðÀ´Õû½à¶ø¼ò¶Ì°É¡£
¡¡¡¡ÊôÐÔֵΪ0£¬²»±ØÌí¼Óµ¥Î»
¡¡¡¡ÊéдÔÔòÊÇÈç¹ûCSSÊôÐÔֵΪ0£¬ÄÇôÄã²»±ØΪÆäÌí¼Óµ¥Î»(Èç:px/em)£¬Äã¿ÉÄÜ»áÕâÑùд:
¡¡¡¡padding: 10px 5px 0px 0px;
¡¡¡¡ÊÔÊÔÕâÑù°É:
¡¡¡¡padding: 10px 5px 0 0;
¡¡¡¡ÒƳýÑ¡ÔñÆ÷
¡¡¡¡Ñ¡ÔñÆ÷ÊÇÄãÔÚΪһЩԪËØÓ¦ÓÃCSSÑùʽʱµÄ»ù±¾·½·¨£¬±ÈÈçh1, h2, h2, div, strong, pre, ul, olµÈµÈ…Èç¹ûÄã
ʹÓÃÁËclass(.ÀàÃû)»òID(#idÃû),ÄÇô¾Í²»ÓÃÔÙÔÚÉùÃ÷CSSʱ°üº¬Ñ¡ÔñÆ÷ÁË¡£
¡¡¡¡div#logowrap
¡¡¡¡³¢ÊÔÈÓµô¶àÓàµÄÑ¡ÔñÆ÷°É:
¡¡¡¡#logowrap
¡¡¡¡ÔÚÕâ¸öÀý×ÓÖÐËùνµÄÄǸöÑ¡ÔñÆ÷¾ÍÊÇdiv
¡¡¡¡*×Ü°®ºÍÄ㿪ÍæЦ
¡¡¡¡ÒªÃ÷ÖǵÄʹÓÃ*¶ø±ÜÃâËüÔÚÕû¸öCSSÑùʽ±íÖÐÂÒ¿ªÍæЦ£¬*ÊǸöͨÅä·û£¬Äã¿ÉÒÔʹÓÃËüÀ´ÎªÄãµÄÉè¼Æ²¿·Ö»òÈ«²¿½øÐÐ
һϵÁÐCSSÉùÃ÷¡£ÀýÈç:
¡¡¡¡* {
¡¡¡¡ margin: 0;
¡¡¡¡}
¡¡¡¡Õâ¸öÉùÃ÷»á½«ËùÓÐÔªËصÄmarginÖµÉèÖÃΪ0£¬Í¬ÑùµÄ£¬ÎªÁËÑϽ÷Æð¼û£¬Äã¿ÉÒÔ³¢ÊÔÕâÑùÉèÖÃ:
¡¡¡¡#menu * {
¡¡¡¡ margin: 0;
¡¡¡¡}
¡¡¡¡ÕâÑùµÄÉùÃ÷ÊÇÖ¸½«#menuϵÄËùÓÐÔªËصÄmarginÉèΪ0¡£
¡¡¡¡±³¾°
¡¡¡¡±³¾°(background)ÊôÐÔ¿ÉÄÜ»á°üº¬ÉèÖñ³¾°É«¡¢±³¾°Í¼¡¢±³¾°Í¼µÄλÖúͱ³¾°Í¼Öظ´·½Ê½µÄ²ÎÊý£¬Äã¿ÉÄÜ»áд³É:
¡¡¡¡background-image: url(”logo.png”);
¡¡¡¡background-position: top center;
¡¡¡¡background-repeat: no-repeat;
¡¡¡¡Æäʵ¿ÉÒÔд³É:
¡¡¡¡background: url(logo.png) no-repeat top center;
¡¡¡¡ÑÕÉ«
¡¡¡¡ÑÕÉ«(color)ÊôÐÔÔÚCSSͨ³£Ö¸¶¨ÎªÒ»¸öÊ®Áù½øÖƵÄÖµ,Ò»¸ö#¼Ó6λÊý£¬ËûµÄ¼òд·½Ê½ÊÇÈç¹ûÑÕÉ«ÖµÓɳɶԶù³öÏÖµÄ
Èý¶Ô¶øÊý×Ö×é³É£¬Äã¿ÉÒÔÊ¡ÂÔµôû¶ÔÖеÄÒ»¸öÊý×Ö¡£
¡¡¡¡#000000 ¿ÉÒÔд³É #000, #336699 ¿ÉÒÔд³É #369
¡¡¡¡ÕâÖÖ¼òд¼¼ÇÉÖ»ÊÊÓÃÓڳɶԳöÏÖµÄÑÕÉ«Öµ£¬ÆäËüÑÕÉ«Öµ²»ÊÊÓÃÕâÖÖ¼¼ÇÉ£¬±ÈÈç:
¡¡
Ïà¹ØÎĵµ£º
ͼƬ×Ô¶¯ÊÊÓ¦´óСµÄÎÊÌâÔÚƽʱÖÆ×÷µÄʱºòÊDZȽϳ£¼ûµÄÎÊÌ⣬ÏÂÃæÌṩһ¸ö±È½Ï¼òµ¥µÄ½â¾ö·½·¨£º
div img {
max-width:600px;
//IE7¡¢FFµÈÆäËû·ÇIEä¯ÀÀÆ÷ÏÂ×î´ó¿í¶ÈΪ600px;
width:600px;
//ËùÓÐä¯ÀÀÆ÷ÖÐͼƬµÄ´óСΪ600px;
width:expression(document.body.clientWidth>600?"600px":"auto");
//µ±Í¼Æ¬´óС´óÓÚ6 ......
CSS Hack ÊÇÔÚ±ê×¼ CSS û°ì·¨¼æÈݸ÷ä¯ÀÀÆ÷ÏÔʾЧ¹ûʱ²Å»áÓÃÉϵIJ¹¾È·½·¨,ÔÚ¸÷ä¯ÀÀÆ÷³§É̽âÎö CSS ûÓдï³ÉÒ»ÖÂÇ°,ÎÒÃÇÖ»ÄÜÓÃÕâÑùµÄ·½·¨À´Íê³ÉÕâÑùµÄÈÎÎñ¡£ÍøÉÏÄã¿ÉÄÜÄÜËÑË÷µ½Ò»´ó¶ÑµÄ CSS Hack£¬µ«ÊÇÎÒ½ñÌì·¢²¼µÄÄã¿ÉÄܲ¢²»¶¼ºÜÁ˽⣬ÒòΪÕâЩ¶¼ÊÇÖ»Õë¶Ôµ¥¶ÀÒ»¸öä¯ÀÀÆ÷µÄ CSS Hack¡£
ΪÁËÏòÄãչʾÕâЩ CSS Hack ÊÇ·ñÕý³£Ô ......
CSS ¶Ôä¯ÀÀÆ÷µÄ¼æÈÝÐÔÓÐʱÈÃÈ˺ÜÍ·ÌÛ£¬»òÐíµ±ÄãÁ˽⵱Öеļ¼ÇɸúÔÀí£¬¾Í»á¾õµÃÒ²²»ÊÇÄÑÊ£¬´ÓÍøÉÏÊÕ¼¯ÁËIE7,6ÓëFireofxµÄ¼æÈÝÐÔ´¦Àí·½·¨²¢ÕûÀíÁË Ò»Ï¡£¶ÔÓÚweb2.0µÄ¹ý¶È£¬Ç뾡Á¿ÓÃxhtml¸ñʽд´úÂ룬¶øÇÒDOCTYPE Ó°Ïì CSS ´¦Àí£¬×÷ΪW3CµÄ±ê×¼£¬Ò»¶¨Òª¼Ó DOCTYPEÉùÃ÷¡£
CSS¼¼ÇÉ
1.d ......
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>www.zishu.cn< ......