DIV+CSSµÄÃüÃû¹æÔò
Ò»¸öÍøÕ¾µÄÓÅ»¯Óкܶ๤×÷Òª×ö£¬ÆäÖжԴúÂëµÄÓÅ»¯ÊÇÒ»¸öºÜ¹Ø¼üµÄ²½Ö衣ΪÁ˸ü¼Ó·ûºÏSEOµÄ¹æ·¶£¬ÏÂÃæ½«¶ÔĿǰÁ÷ÐеÄDIV+CSSµÄÃüÃû¹æÔòÕûÀíÈçÏ£º
ҳͷ£ºheader µÇ¼Ìõ£ºloginBar
±êÖ¾£ºlogo ²àÀ¸£ºsideBar
¹ã¸æ£ºbanner µ¼º½£ºnav
×Óµ¼º½£ºsubNav ²Ëµ¥£ºmenu
×Ӳ˵¥£ºsubMenu ËÑË÷£ºsearch
¹ö¶¯£ºsrcoll Ò³ÃæÖ÷Ì壺main
ÄÚÈÝ£ºcontent ±êǩҳ£ºtab
ÎÄÕÂÁÐ±í£ºlist ÌáʾÐÅÏ¢£ºmsg
С¼¼ÇÉ£ºtips À¸Ä¿±êÌ⣺title
¼ÓÈ룺joinus Ö¸ÄÏ£ºguide
·þÎñ£ºservice Èȵ㣺hot
ÐÂÎÅ£ºnews ÏÂÔØ£ºdownload
×¢²á£ºregister ״̬£ºstatus
°´Å¥£ºBTn ͶƱ£ºvote
ºÏ×÷»ï°é£ºpartner ÓÑÇéÁ´½Ó£ºfriendLink
Ò³½Å£ºfooter °æÈ¨£ºcopyRight
CSSIDµÄÃüÃûÈçÏ£º
ÍâÌ×£ºwrap Ö÷µ¼º½£ºmainNav
×Óµ¼º½£ºsubNav Ò³½Å£ºfooter
Õû¸öÒ³Ãæ£ºcontent ҳü£ºheader
É̱꣺label ±êÌ⣺title
Ö÷µ¼º½£ºmainNav(globalNav) ¶¥µ¼º½£ºtopnav
±ßµ¼º½£ºsidebar ×󵼺½£ºleftsideBar
ÓÒµ¼º½£ºrightsideBar ÆìÖ¾£ºlogo
±êÓbanner ²Ëµ¥ÄÚÈÝ1£ºmenu1Content
²Ëµ¥ÈÝÁ¿£ºmenUContainer ×Ӳ˵¥£ºsubmenu
±ßµ¼º½Í¼±ê£ºsidebarIcon ×¢ÊÍ£ºnote
Ãæ°üм£ºbreadCrumb£¨¼´Ò³ÃæËù´¦Î»Öõ¼º½Ìáʾ£© ÈÝÆ÷£ºcontainer
ÄÚÈÝ£ºcontent ËÑË÷£ºsearch
µÇ¼£ºlogin ¹¦ÄÜÇø£ºshop£¨È繺Îï³µ£¬ÊÕÒøÌ¨£© µ±Ç°µÄ£ºcurrent
ÕâЩ±ê×¼µÄÃüÃû¸üÓÐÀûÓÚÉè¼Æ¹¤×÷ÖеĶàÈËÐ×÷ģʽÒÔ¼°´úÂëµÄ½øÒ»²½±ê×¼»¯
Ïà¹ØÎĵµ£º
ÔÎÄ´«ËÍÃÅ£ºhttp://blog.csdn.net/dux003/archive/2009/11/08/4786371.aspx
csdn blog css×Ô¶¨ÒåÉèÖÃ
¿ÉÒÔÔÚ²©¿ÍµÄÅäÖÃÒ³ÃæµÄ×Ô¶¨ÒåcssÀ¸ÖÐÌîÈëcssÑùʽ´úÂëÀ´×Ô¶¨Ò²blogµÄ·ç¸ñ
csdn blogµÄÒ³Ãæ¼Ü¹¹»ù±¾ÊÇÓÉdivʵÏֵģ¬Õû¸öÒ³ÃæÖ÷ÒªÓÉÈý¸ödiv×é³É£¬ËüÃǵÄid·Ö±ðÊÇ:
csdnblog_header, csdnblog_sidebar, csdnblog_conten ......
ÔÚ¹úÄÚÍøÕ¾ÖУ¬°üÀ¨Èý´óÃÅ»§£¬ÒÔ¼°“ÒýÁì”ÖйúÍøÕ¾Éè¼Æ³±Á÷µÄÀ¶É«ÀíÏ룬ChinaUIµÈ¶¼ÊÇʹÓÃÁËpx×÷Ϊ×ÖÌ嵥λ¡£Ö»ÓаٶȺôõ×öÁ˸ö¿Éµ÷µÄ±íÂÊ¡£¶øÔÚ´óÑó±Ë°¶£¬¼¸ºõËùÓеÄÖ÷Á÷Õ¾µã¶¼Ê¹ÓÃem×÷Ϊ×ÖÌ嵥룬Ҳ¾ÍÊǿɵ÷µÄ¡£Ã»´í£¬px±Èem¸ü¼ÓÈÝÒ×ʹÓ㬴󲿷ֶÁÕß²»ÖªµÀemΪºÎÎï»òÕßËüÏ൱ÓÚ¶àÉÙpx¡£¹úÍâÈËÊ¿Èç´ËÖØÊÓÍøÕ ......
ie6ÖÐdivµÄ¸ß¶È×Ô¶¯ÉèÖ㬵½ÁËie7ºÍie8¾Í²»ÐÐÁË£¬ÐèÒªÉèÖÃcss
/*Õë¶Ô·ÇIE*/
div:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
/*Õë¶ÔIE*/
div{zoom:1;} ......
<style type="text/css">
/*
¸ù¾ÝinputµÄtypeÀ´¿ØÖÆcssÑùʽ
*/
/*
1.ÓÃcssµÄexpressionÅжϱí´ïʽ
Óŵ㣺¼òµ¥£¬ÇáÁ¿¼¶
ȱµã£ºexpressionÅжϱí´ïʽFireFoxÊDz»Ö§³ÖµÄ¡£ÖÂÃüµÄÊÇÖ»ÄÜÇø·Ö³öÒ»¸ö£¨ÀýÈçÀý×ÓÖоÍÖ»ÄÜÇø·Ö³ötextÎı¾¿ò£©£¬²»ÒªÊÔͼÉèÖöà¸ö£¬ÏÂÃæµÄ»á½«ÉÏÃæµÄ¸²¸Çµô
input
{
background- ......