TABLE嵌套
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>花房姑娘</title>
<style>
a {
text-decoration: none;
}
table tr:first-child th:first-child {
border-top-left-radius: 12px;
}
table tr:first-child th:last-child {
border-top-right-radius: 12px;
}
table tr:last-child td:first-child {
border-bottom-left-radius: 12px;
}
table tr:last-child td:last-child {
border-bottom-right-radius: 12px;
}
.ad {
box-shadow: 2px 10px 10px #9bc1ca;
}
.bd {
border-radius: 5px;
}
.cd {
font-size: 18px;
font-family: "微软雅黑";
}
.dd {
font-size: 10px;
font-family: "微软雅黑";
font-weight: bold;
}
.ed {
font-family: "agency fb";
font-size: 15px;
background-color: #9bc1ca;
}
.fd {
background-color: #9bc1ca;
font-family: "微软雅黑";
color: white;
font-size: 12px;
}
</style>
</head>
<body>
<table align="center" width="80%" border="0" cellpadding="0" cellspacing="0px">
<tr>
<th align="center" colspan="6"><img src="img/ti.jpg" width="100%" height="100%" class="bd"></th>
</tr>
<tr class="cd" bgcolor="f8dcd8">
<td align="center">
<a href="index.html">首页</a>
</td>
<td align="center">
<a href="gongsijianjie.html">公司简介</a>
</td>
<td align="center">
<a href="chanpin.html">产品展示</a>
</td>
<td align="center">
<a href="hezuo.html">合作伙伴</a>
</td>
<td align="center">
<a href="dingdan.html">在线订单</a>
</td>
<td align="center">
<a href="#mj">联系我们</a>
</td>
</tr>
<tr>
<td width="20%" valign="top">
<table class="ad" width="100%" border="0" cellpadding="0" cellspacing="2" bordercolor="ffffff">
<tr>
<th align="center" bgcolor="f8dcd8">
<h3 align="center">鲜花分类</h3>
</th>
</tr>
<tr>
<td align="left" bgcolor="f8dcd8">
<a href="huashu.html"> 花束<br/><br/><br/></a>
</td>
</tr>
<tr>
<td align="left" bgcolor="f8dcd8">
<a href="huahe.html"> 花盒<br/><br/><br/></a>
</td>
</tr>
<tr>
<td align="left" bgcolor="f8dcd8">
<a href="pinghua.html"> 瓶花<br/><br/><br/></a>
</td>
</tr>
<tr>
<td align="left" bgcolor="f8dcd8">
<a href="jingpin.html"> 精品鲜花<br/><br/><br/></a>
</td>
</tr>
<tr>
<td align="left" bgcolor="f8dcd8">
<a href="guolan.html"> 果篮<br/><br/><br/></a>
</td>
</tr>
<tr>
<td align="left" bgcolor="f8dcd8">
<a href="zhuomian.html"> 桌面花篮<br/><br/><br/></a>
</td>
</tr>
<tr>
<td align="left" bgcolor="f8dcd8">
<a href="kaiye.html"> 开业花篮<br/><br/><br/></a>
</td>
</tr>
</table>
</td>
<td colspan="5" width="80%">
<table align="center" border="0" cellpadding="0" cellspacing="5" bgcolor="#ffffff">
<tr>
<th align="left" colspan="2"><img src="img/1.jpg" width="70%" /></th>
<th align="right" colspan="2"><img src="img/2.jpg" width="15%" /></th>
</tr>
<tr class="dd">
<td bgcolor="f8dcd8" align="right" colspan="4">1/25【首页】 【上一页】 【上一页】 【尾页】</td>
</tr>
<tr class="ed">
<td width="10%" align="center"> <img src="img/9012338.jpg_220x240.jpg" width="100%" />鲜花/灿烂的笑容</td>
<td width="10%" align="center"> <img src="img/9012344.jpg_220x240.jpg" width="100%" />鲜花/盛放的热情</td>
<td width="10%" align="center"> <img src="img/9012361.jpg_220x240.jpg" width="100%" />鲜花/浅浅的温柔</td>
<td width="10%" align="center"> <img src="img/9020014.jpg_220x240.jpg" width="100%" />鲜花/不褪色的爱</td>
</tr>
<tr class="ed">
<td width="10%" align="center"> <img src="img/9012175.jpg_220x240.jpg" width="100%" />鲜花/月光女神</td>
<td width="10%" align="center"> <img src="img/9012201.jpg_220x240.jpg" width="100%" />鲜花/馨情无限</td>
<td width="10%" align="center"> <img src="img/9012233.jpg_220x240.jpg" width="100%" />鲜花/夏日倾情</td>
<td width="10%" align="center"> <img src="img/9012234.jpg_220x240.jpg" width="100%" />鲜花/水瓶座守护花</td>
</tr>
<tr class="ed">
<td width="10%" align="center"> <img src="img/9012136.jpg_220x240.jpg" width="100%" />鲜花/等你来</td>
<td width="10%" align="center"> <img src="img/9012252.jpg_220x240.jpg" width="100%" />鲜花/请原谅我</td>
<td width="10%" align="center"> <img src="img/9012278.jpg_220x240.jpg" width="100%" />鲜花/春韵--嫣然</td>
<td width="10%" align="center"> <img src="img/9012150.jpg_220x240.jpg" width="100%" />鲜花/嫁给我吧</td>
</tr>
<tr class="ed">
<td width="10%" align="center"> <img src="img/9050016.jpg_220x240.jpg" width="100%" />鲜花/清新--白雪</td>
<td width="10%" align="center"> <img src="img/9012011.jpg_220x240.jpg" width="100%" />鲜花/阳光海岸</td>
<td width="10%" align="center"> <img src="img/9012105.jpg_220x240.jpg" width="100%" />鲜花/青春之歌</td>
<td width="10%" align="center"> <img src="img/9012123.jpg_220x240.jpg" width="100%" />鲜花/梦里花开</td>
</tr>
<tr class="dd">
<td bgcolor="f8dcd8" width="100%" colspan="4" align="right">1/25【首页】 【上一页】 【上一页】 【尾页】</td>
</tr>
</table>
</td>
</tr>
</table>
<p align="center" class="fd">
<br /><br /><br /><br /><br /><br /><br /> 版权所有 © 2016 HuaFang.上海市花房姑娘全国连锁有限公司<br/> <br /><br /> 中国花卉协会会员 中国电子商务协会会员 ICP经营许可证:粤B2-20050755 |<img src="img/dd.PNG" width="15px" height="15px" /> 粤ICP备09171662号 粤公网安备44030502000373号 Copyright © 2005-2019<br/> <br /><br /> 花房姑娘 www.huafang.com 上海花房姑娘全国连锁有限公司 中国鲜花网领先品牌,鲜花速递专家!<br />
<a name="mj"></a>
联系我们:<br/> 内容合作QQ群:200246203 <br/> 微信搜索:花房姑娘公众号
<br/> 电子邮箱:2628210285@qq.com
<br /><br /><br /><br /><br /><br /><br /><br />
</p>
</body>
</html>
运行效果图: