img{width:184pxheight:140pxfloat:leftmargin-right:10px}
.m0{margin-right:0}
html部分如下:
<img src="" />
<img src="" />
<img src="" />
<img src="" />
<img src="" class="m0" />
说明:
图片宽度 184×5=920
剩余间距 960-920=40
5张图4个间距,每个 40÷4=10
样式中img将5张图均设置右边距(margin-right)10px,总间距10×5=50
总间距超出剩余间距10,故单独在第5张图上加样式margin-right:0清除右间距
欲想效果出现
:)
你在 head css里面再加一条div{float:left}就行了
譬如
<style type="text/css">
div{float:left}
body {
font-family: "Times New Roman", "宋体", arial
font-size: 12px
margin:0 auto
text-align: center
background-image: url(../../images/background_top_0.png)
}
。。。。。。。。。。。。。。。。。。
我帮你写了个<style type="text/css">
<!--
#all {
width:900px
margin:0 auto
}
#head {
height:300px
background-color:#0CF
position:relative
}
#head .menu {
height:35px
background-color:#069
color:#FFF
width:870px
position:absolute
top:250px
left:15px
}
#content {
margin:10px 0
height:300px
}
#content .left {
width:445px
height:300px
background-color:#F90
float:left
}
#content .right {
width:445px
height:300px
margin-left:10px
background-color:#FC0
float:left
}
#foot {
clear:both
height:80px
background-color:#999
}
-->
</style>
<div id="all">
<div id="head">
<div class="menu">这里是菜单</div>
</div>
<div id="content">
<div class="left">这里是左边</div>
<div class="right">这里是右边</div>
</div>
<div id="foot">这里是底部</div>
</div>
这样布局有利于SEO优化,页面代码简洁,用TABLE做的话,页面代码起码比CSS多几倍