标签:三亚 亲子 yen JavaWeb7.4 自由 HTML 标签 899 蜜月
- 确定使用table来完成布局
- 如果某一行只有一个单元格,则使用
<tr><td></td></tr>
- 如果某一行有多个单元格,则使用
<tr>
<td>
<table></table>
</td>
</tr>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>黑马旅游网</title>
</head>
<body>
<table width="100%", align="center"><!--最外层table,用于页面布局-->
<!--第1行-->
<tr>
<td><img src="../image/top_banner.jpg", width="100%"></td>
</tr>
<!--第2行-->
<tr>
<td>
<table width="100%", align="center"><!--内层嵌套table1-->
<tr>
<td><img src="../image/logo.jpg"></td>
<td><img src="../image/search.png"></td>
<td><img src="../image/hotel_tel.png"></td>
</tr>
</table><!--内层嵌套table1/-->
</td>
</tr>
<!--第3行-->
<tr>
<td>
<table width="100%", align="center">
<tr bgcolor="yellow", align="center", height="45">
<td><a href="">首页</a></td>
<td><a href="">首页</a></td>
<td><a href="">首页</a></td>
<td><a href="">首页</a></td>
<td><a href="">首页</a></td>
<td><a href="">首页</a></td>
<td><a href="">首页</a></td>
<td><a href="">首页</a></td>
<td><a href="">首页</a></td>
<td><a href="">首页</a></td>
</tr>
</table>
</td>
</tr>
<!--第4行-->
<tr>
<td><img src="../image/banner_3.jpg", width="100%"></td>
</tr>
<!--第5行-->
<tr>
<td>
<img src="../image/icon_5.jpg">
黑马精选
<hr color="#ffd700">
</td>
</tr>
<!--第6行-->
<tr>
<td>
<table align="center", width="95%">
<tr>
<td>
<img src="../image/jiangxuan_1.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
<td>
<img src="../image/jiangxuan_1.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
<td>
<img src="../image/jiangxuan_1.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
<td>
<img src="../image/jiangxuan_1.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
</tr>
</table>
</td>
</tr>
<!--第7行-->
<tr>
<td>
<img src="../image/icon_6.jpg">
国内游
<hr color="#ffd700">
</td>
</tr>
<!--第8行-->
<tr>
<td>
<table align="center", width="95%">
<tr>
<td rowspan="2">
<img src="../image/guonei_1.jpg">
</td>
<td>
<img src="../image/jiangxuan_2.jpg", width="100%">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
<td>
<img src="../image/jiangxuan_2.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
<td>
<img src="../image/jiangxuan_2.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
</tr>
<tr>
<td>
<img src="../image/jiangxuan_2.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
<td>
<img src="../image/jiangxuan_2.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
<td>
<img src="../image/jiangxuan_2.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
</tr>
</table>
</td>
</tr>
<!--第9行-->
<tr>
<td>
<img src="../image/icon_7.jpg">
境外游
<hr color="#ffd700">
</td>
</tr>
<!--第10行-->
<tr>
<td>
<table align="center", width="95%">
<tr>
<td rowspan="2">
<img src="../image/jiangwai_1.jpg">
</td>
<td>
<img src="../image/jiangxuan_3.jpg", width="100%">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
<td>
<img src="../image/jiangxuan_3.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
<td>
<img src="../image/jiangxuan_3.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
</tr>
<tr>
<td>
<img src="../image/jiangxuan_3.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
<td>
<img src="../image/jiangxuan_3.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
<td>
<img src="../image/jiangxuan_3.jpg">
<p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
<font color="red">¥ 899</font>
</td>
</tr>
</table>
</td>
</tr>
<!--第11行-->
<tr>
<td><img src="../image/footer_service.png", width="100%"></td>
</tr>
<!--第12行-->
<tr>
<td align="center", bgcolor="yellow">
<footer>
<font color="#808080", size="2">
<center>
江苏 传智播客教育科技股份有限公司版权所有<br/>
Copyright 2006-2018©, All Rights Reserved 苏ICP备16007882
</center>
</font>
</footer>
</td>
</tr>
</table><!--最外层table,用于页面布局/-->
</body>
</html>
标签:三亚,亲子,yen,JavaWeb7.4,自由,HTML,标签,899,蜜月 来源: https://www.cnblogs.com/yppah/p/14934111.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。