DIV+CSSµÄÓŵãÓëȱµã
תÔØ×Ô£ºdiv+cssÓŵã
http://blog.sina.com.cn/s/blog_4fe1e5e90100bdtk.html
×î½üÃæÊÔÁ˶à¼Ò¹«Ë¾...Óиö¹ØÓÚdiv+css²¼¾ÖºÃ´¦µÄÎÊÌâ,ÎÊÁ˺öà´Î..ÎһشðÁËһЩ,µ«ÊDz»Ì«È«Ãæ..
½ñÌì´ÓÍøÉÏϵͳµÄËÑË÷µ½ÁËһЩ,²Î¿¼
DIV±¾Éí¾ÍÊÇÈÝÆ÷ÐÔÖʵÄ,Äã²»µ«¿ÉÒÔÄÚǶtable»¹¿ÉÒÔÄÚǶÎı¾ºÍÆäËüµÄHTML´úÂ룻CSSÊÇCascADIng style SheetsµÄ¼ò³Æ£¬ÖÐÎÄÒë×÷“²ãµþÑùʽ±íµ¥”£¬ÔÚÖ÷Ò³ÖÆ×÷ʱ²ÉÓÃCSS¼¼Êõ£¬¿ÉÒÔÓÐЧµØ¶ÔÒ³ÃæµÄ²¼¾Ö¡¢×ÖÌå¡¢ÑÕÉ«¡¢±³¾°ºÍÆäËüЧ¹ûʵÏÖ¸ü¼Ó¾«È·µÄ¿ØÖÆ¡£Ö»Òª¶ÔÏàÓ¦µÄ´úÂë×öһЩ¼òµ¥µÄÐ޸ģ¬¾Í¿ÉÒԸıäͬһҳÃæµÄ²»Í¬²¿·Ö£¬»òÕßËùÓÐÒ³ÊýµÄÍøÒ³µÄÍâ¹ÛºÍ¸ñʽ¡£
Div+CSS±ê×¼¾ßÓÐÒÔÏÂÓŵã:
1¡¢ÒòΪ²ÉÓÃCSS²¼¾Ö£¬²»Ïó±í¸ñ²¼¾Ö³äÂú¸÷ÖÖ¸÷ÑùµÄÊôÐÔºÍÊý×Ö£¬¶øÇҺܶàcssÎļþͨ³£Êǹ²Óõģ¬´Ó¶ø´ó´óËõ¼õÒ³Ãæ´úÂ룬Ìá¸ßÒ³Ãæä¯ÀÀËٶȡ£
2¡¢½á¹¹ÇåÎú£¬¶ÔËÑË÷ÒýÇæ¸ü¼ÓÓѺ᣸üÈÝÒ×±»ËÑË÷ÒýÇæÊÕ¼£¬¾ß±¸ËÑË÷ÒýÇæSEOµÄÏÈÌìÌõ¼þ£¬ÅäºÏÓÅÐãµÄÄÚÈݺÍһЩSEO´¦Àí£¬¿ÉÒÔ»ñµÃ¸üºÃµÄÍøÕ¾ÅÅÃû¡£
3¡¢¼æÈÝÐÔ¸üºÃ£¬·ûºÏweb±ê×¼¹æ·¶µÄ·¢Õ¹Ç÷ÊÆ£¬¿ÉÒÔÔÚ¼¸ºõËùÓеÄä¯ÀÀÆ÷É϶¼¿ÉÒÔʹÓ㬲»»á³öÏÖÔÚ²»Í¬µÄä¯ÀÀÆ÷ÖÐЧ¹û²î¾àºÜ´óµÄÇé¿ö¡£
4¡¢Ëõ¶Ì¸Ä°æʱ¼ä£¬ÒòΪÍøÕ¾µÄ²¼¾Ö¶¼ÊÇͨ¹ýÍⲿµÄcssÎļþÀ´¿ØÖÆ£¬Ö»Òª¼òµ¥µÄÐ޸ļ¸¸öCSSÎļþ¾Í¿ÉÒÔ½«Ðí¶àÍøÒ³µÄ·ç¸ñ¸ñʽͬʱ¸üУ¬²»ÓÃÔÙÒ»Ò³Ò»Ò³µØ¸üÐÂÁË¡£Äã¿ÉÒÔ½«Õ¾µãÉÏËùÓеÄÍøÒ³·ç¸ñ¶¼Ê¹ÓÃÒ»¸öCSSÎļþ½øÐпØÖÆ£¬Ö»ÒªÐÞ¸ÄÕâ¸öCSSÎļþÖÐÏàÓ¦µÄÐУ¬ÄÇôÕû¸öÕ¾µãµÄËùÓÐÒ³Ã涼»áËæÖ®·¢Éú±ä¶¯¡£
5¡¢Ç¿´óµÄ×ÖÌå¿ØÖƺÍÅÅ°æÄÜÁ¦£¬CSS¿ØÖÆ×ÖÌåµÄÄÜÁ¦±ÈÔã¸âµÄFONT±êÇ©ºÃ¶àÁË£¬CSS²»ÔÙÐèÒªÓÃFONT±êÇ©»òÕß͸Ã÷µÄ1pxͼƬÀ´¿ØÖƱêÌâ¡¢¸Ä±ä×ÖÌåÑÕÉ«¡¢×ÖÌåÑùʽµÈµÈ¡£
6¡¢Ìá¸ßÒ×ÓÃÐÔ£¬Ê¹ÓÃCSS¿ÉÒԽṹ»¯HTML£¬ÀýÈ磺p±êÇ©Ö»ÓÃÀ´¿ØÖƶÎÂ䣬h1-h6±êÇ©Ö»ÓÃÀ´¿ØÖƱêÌ⣬table±êÇ©Ö»ÓÃÀ´±íÏÖ¸ñʽ»¯µÄÊý¾ÝµÈµÈ¡£Äã¿ÉÒÔÔö¼Ó¸ü¶àµÄÓû§¶ø²»ÐèÒª½¨Á¢¶ÀÁ¢µÄ°æ±¾¡£
7¡¢¸üºÃµÄÀ©Õ¹ÐÔ¡£ÄãµÄÉè¼Æ²»½ö½öÓÃÓÚwebä¯ÀÀÆ÷£¬Ò²¿ÉÒÔ·¢²¼ÔÚÆäËûÉ豸ÉÏ£¬±ÈÈçPowerPointµÈ¡£
8¡¢¸üÁé»î¿ØÖÆÒ³Ãæ²¼¾Ö£¬Í¨³£Ò³ÃæµÄÏÂÔØÊÇ°´ÕÕ´úÂëµÄÅÅÁÐ˳Ðò£¬¶ø±í¸ñ²¼¾Ö´úÂëµÄÅÅÁдú±í´ÓÉÏÏòÏ£¬´Ó×óµ½ÓÒ£¬ÎÞ·¨¸Ä±ä¡£¶øͨ¹ýCSS¿ØÖÆ£¬Äú¿ÉÒÔÈÎÒâ¸Ä±ä´úÂëµÄÅÅÁÐ˳Ðò£¬±ÈÈ罫ÖØÒªµÄÓÒ±ßÄÚÈÝÏȼÓÔسöÀ´¡£
9¡¢±íÏÖºÍÄÚÈÝÏà·ÖÀ룬¸É¾»ÀûÂ䣬½«Éè¼Æ²¿·Ö°þÀë³öÀ´·ÅÔÚÒ»¸ö¶ÀÁ¢ÑùʽÎļþÖУ¬¶øÍøÒ³Ö÷ÒªÀ´·ÅÖÃÄúµÄÄÚÈÝ£¬Äã¿ÉÒÔ¼õÉÙδÀ´ÍøÒ³ÎÞЧµÄ¿ÉÄÜ¡£
10¡¢¸ü·½±ãËÑË÷ÒýÇæÊÕ¼£¬²¢»ñµÃ¸ü¸ß
Ïà¹ØÎĵµ£º
ÔÎÄÁ´½Ó£ºhttp://www.fendou163.cn/article/20090115/24807.html
¡¡¡¡WebÍøÕ¾¿ÉÓÃÐԵĹؼüÖ¸±êÊÇËٶȣ¬¸üÈ·ÇеØ˵£¬ÊÇÒ³ÃæÄÜÒÔ¶à¿ìµÄËٶȳöÏÖÔÚ·ÃÎÊÕßµÄä¯ÀÀÆ÷´°¿ÚÀï¡£Ó°ÏìËٶȵÄÒòËØÓкܶàÖÖ£¬°üÀ¨Web·þÎñÆ÷µÄËٶȡ¢·ÃÎÊÕßµÄInternetÁ¬½ÓÇé¿ö£¬ÒÔ¼°ä¯ÀÀÆ÷±ØÐëÏÂÔصÄÎļþ´óС¡£¾¡¹ÜÄãÎÞ·¨¿ØÖÆ·þÎñÆ÷ºÍÁ¬½ÓµÄËٶȣ¬µ«ÊÇÄ ......
margin-bottom:8px;ÉèÖöÔÏóϱ߾àµÄ¸ß¶È
ÄÚÁª¶ÔÏóҪʹÓøÃÊôÐÔ£¬±ØÐëÏÈÉ趨¶ÔÏóµÄheight»òwidthÊôÐÔ£¬»òÕßÉ趨positionÊôÐÔΪabsolute¡£
padding-top:10px;ÓëÉÏÒ»¸ö±êÇ©µÄ¾àÀë
padding-left:10px;Óë×ó±ßµÄ¼ä¾à
¼ìË÷»òÉèÖöÔÏ󶥱ߵIJ¹¶¡±ß¾à¡£
ÄÚÁª¶ÔÏóҪʹÓøÃÊôÐÔ£¬±ØÐëÏÈÉ趨¶ÔÏóµÄheight»òwidthÊôÐÔ£¬»òÕßÉ趨pos ......
Æð³õµÄHTMLµÄÉè¼ÆÖ»ÊǶ¨ÒåÎĵµÄÚÈÝÓ㬶ø¶ÔÓÚÎĵµ²¼¾ÖÔòÓÉä¯ÀÀÆ÷À´Íê³É¡£ºóÀ´ÓÉÓÚä¯ÀÀÆ÷·þÎñÉ̲»¶ÏµØ½«ÐµĹ淶ÖУ¬Ê¹µÃ´´½¨ÎĵµÄÚHTML±êÇ©Ìí¼Óµ½HTMLÈÝÇåжÀÁ¢ÓÚ±íÏÖ²ãµÄÕ¾µãÔ½À´Ô½¸´ÔÓ¡£ÎªÁ˽â¾öÕâ¸öÎÊÌ⣬ÍòάÍøÁªÃË£¨W3C£©£¬¼ç¸ºÆðÁË HTML ±ê×¼»¯µÄʹÃü£¬²¢ÔÚ HTML 4.0 Ö®Íâ´´Ôì ......
Ò»¡¢CSSÎļþ¼°ÑùʽÃüÃû
1¡¢CSSÎļþÃüÃû¹æ·¶
È«¾ÖÑùʽ£ºglobal.css£»
¿ò¼Ü²¼¾Ö£ºlayout.css£»
×ÖÌåÑùʽ£ºfont.css£»
Á´½ÓÑùʽ£ºlink.css£»
´òÓ¡Ñùʽ£ºprint.css£»
2¡¢CSSÑùʽÃüÃû¹æ·¶
±¾È˽¨Ò飺ÓÃ×Öĸ¡¢_ºÅ¹¤¡¢-ºÅ¡¢Êý×Ö×é³É£¬±ØÐëÒÔ×Öĸ¿ªÍ·£¬²»ÄÜΪ´¿Êý×Ö¡£ÎªÁË¿ª·¢ºóÑùʽÃû¹ÜÀí·½±ã£¬´ó¼ÒÇëÓÃÓÐÒâÒåµÄµ¥ ......
<!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=gbk" />
<title>www.zishu.cn</t ......