<html>
<head>
<style type="text/css">
.machine {
font-size: 12px
} .title {
height: 21px
width: 420px
margin: 1px 1px -1px 1px
border-style: solid
border-width: 1px
border-color: #CFCFCF
} .title_l {
padding: 2px
float: left
} .title_r {
padding: 2px
float: right
} .table {
width: 424px
} .table span {
margin: 1px
padding: 2px
float: left
display: block
width: 100px
text-align: center
background-color: #CAE1FF
} .clear {
clear: both
} .comment {
font-size: 8px
color: #8B7500
}
</style>
</head>
<body>
<div class="machine">
<div class="title">
<span class="title_l">包装机械</span>
<span class="title_r">更多</span>
</div>
<div class="clear">
</div>
<div class="table">
<span>打包机<em class="comment">HOT</em></span>
<span>真空包装机</span>
<span>封装机</span>
<span>缠绕机</span>
<span>贴标机</span>
<span>收缩机</span>
<span>纸箱成型机</span>
<span>套袋包装机</span>
<span>装盒机</span>
<span>装箱机</span>
</div>
<div class="clear">
</div>
<div class="title">
<span class="title_l">包装机械</span>
<span class="title_r">更多</span>
</div>
<div class="clear">
</div>
<div class="table">
<span>打包机</span>
<span>真空包装机</span>
<span>封装机</span>
<span>缠绕机<em class="comment">HOT</em></span>
<span>贴标机</span>
<span>收缩机</span>
<span>纸箱成型机</span>
<span>套袋包装机<em class="comment">HOT</em></span>
<span>装盒机</span>
<span>装箱机</span>
</div>
<div class="clear">
</div>
<div class="title">
<span class="title_l">包装机械</span>
<span class="title_r">更多</span>
</div>
<div class="clear">
</div>
<div class="table">
<span>打包机</span>
<span>真空包装机<em class="comment">HOT</em></span>
<span>封装机</span>
<span>缠绕机</span>
<span>贴标机</span>
<span>收缩机</span>
<span>纸箱成型机</span>
<span>套袋包装机</span>
<span>装盒机</span>
<span>装箱机</span>
</div>
<div class="clear">
</div>
</div>
</body>
这个样子成吧?
如果搂住能看明白我就不解释了~
只是要一个颜色的有很多种写法最简单的就是<div style="width:960pxmargin:0px autoheight:20pxoverflow:hiddenbackground:red"></div>
还有就是把那个当边框使用，<div style="width:960pxmargin:0px autooverflow:Hidddenheight:10pxborder-bottom:20px solid red"></div>
这两个是比较常用的，渐变的话就拿小个的图片横向平铺过去就可以了
