内容+表现=页面
XHTML+CSS=PAGE
内容与表现分开,就是内容使用HTML,XHTML,而怎么对内容排版,显示使用CSS 标准网页的优点:
1. 代码更少,更容易维护.
2. 页面下载更快,宽带要求更低,硬盘容量需求更少.
3. 排版更加方便.
4. 可以提高易用性与可扩展性(可以适应很多其它的设备:搜索蜘蛛/屏幕阅读器/打印机/手持设备/移动设备等)
5. 内容与表现分离,使扩展更加简单,分工协作更加简单.
给你
.parent{width:900px height:auto margin:0 auto padding:0 35px
}
.son{
width:100px height:100px margin:0 25px display:inline float:left background-color:blue
}
html代码：
<div class="parent">
<div class="son"></div>
<div class="son"></div>
<div class="son"></div>
<div class="son"></div>
<div class="son"></div>
<div class="son"></div>
</div>
因为你这个的要求是宽度970，而每个子div宽度100加上左右边距各25，相当于每个子div宽度为150, 6个这样的div宽度只有900，故父div要写左右内边距各35px
html{height:100%}body{min-height:100%_height:100%cursor:defaultmin-width:940px_position:}#s_wrap{width:100%min-height:100%padding-bottom:36px}#s_main{display:blockmargin:0 autowidth:911pxfont-family:arial, 'Hiragino Sans GB', 'Microsoft Yahei', '寰蒋板呴粦', '瀹嬩綋', \5b8b\4f53, Tahoma, Arial, Helvetica, STHeiti}#s_main button,#s_main input,#s_main select,#s_main textarea{font-family:arial, 'Hiragino Sans GB', 'Microsoft Yahei', '寰蒋板呴粦', '瀹嬩綋', \5b8b\4f53, Tahoma, Arial, Helvetica, STHeiti}#s_main a,#s_main span{outline:none}#u_sp .s-user-name-top{position:relative}#u_sp .s-user-name-top a{text-decoration:noneheight:24pxline-height:24pxpadding-left:7pxwidth:72px-moz-user-select:nonecursor:pointertext-align:leftdisplay:blockcolor:#0079F5margin:0}#u_sp .s-user-name-top a:hover{background:#F1F8FFtext-decoration:none}#u_sp .s-user-name-top a.sep{border-top:1px solid #ebebeb}.s-user-set-menu{padding-top:6pxtop:33pxposition:absoluteright:75px*right:73pxfloat:rightwidth:100pxz-index:999text-align:left}.s-user-set-menu div{position:relativeborder:1px solid #E3E3E3box-shadow:1px 2px 1px 0 rgba(0,0,0,0.072)-moz-box-shadow:1px 2px 1px 0 rgba(0,0,0,0.072)-webkit-box-shadow:1px 2px 1px 0 rgba(0,0,0,0.072)filter:progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#e3e3e3')-ms-filter:"progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#e3e3e3')"}.s-user-set-menu div a{-ms-filter:""}.s-user-set-menu.menu-top{width:79px}.s-user-set-menu .menu-arrow{display:inline-blockheight:2px_margin-top:-10pxposition:absolutetop:1px_top:10pxheight:6pxwidth:11pxbackground:url("../img/load_ext_spis_65c74648.png") no-repeat -20px -90px}.s-user-set-menu.menu-set .menu-arrow{float:leftleft:27px}
