12-12-12
posts - 397,comments - 0,views - 25332
HTML_旅游网站首页和实现HTML_旅游网站首页

案例网站首页

　　　确定使用table来完成布局

　　　如果某一行只有一个单元格则使用<tr><td><td/><tr/>

　　　如果某一行有多个单元格则使用

　　<tr>

　　　　<td>

　　　　<table><table/>

　　　　<td/>

　　<tr>

 

 

 

 

 

 

 

 

 

 

实现HTML_旅游网站首页

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <table width="100%" align="center">
        <tr>
            <td>
                <img src="images/top_banner.jpg" width="100%" alt="">
            </td>
        </tr>
        <tr>
            <td>
                <table width="100%" align="center">
                    <tr>
                        <td>
                            <img src="images/logo.jpg" alt="">
                        </td>
                        <td>
                            <img src="images/search.png" alt="">
                        </td>
                        <td>
                            <img src="images/hotel_tel.png" alt="">
                        </td>
                    </tr>
                </table>
            </td>
        </tr>

        <tr>
            <td>
                <table width="100%" align="center">
                    <tr bgcolor="#ffd700" align="center" height="45">
                        <td>
                            <a href="">首页</a>
                        </td>
                        <td>
                            门票
                        </td>
                        <td>
                            门票
                        </td>
                        <td>
                            门票
                        </td>
                        <td>
                            门票
                        </td>
                        <td>
                            门票
                        </td>
                        <td>
                            门票
                        </td>
                        <td>
                            门票
                        </td>
                        <td>
                            门票
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
            <tr>
                <td>
                    <img src="images/banner_3.jpg" alt="" width="100%">
                </td>
            </tr>
        <tr>
            <td>
                <img src="images/icon_5.jpg" alt="">
                黑马精选
                <hr color="#ffd700">
            </td>
        </tr>
        <tr>
            <td>
                <table align="center" width="95%">
                    <tr>
                        <td>
                            <img src="images/jiangxuan_1.jpg" alt="">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 899</font>
                        </td>

                        <td>
                            <img src="images/jiangxuan_1.jpg" alt="">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 899</font>
                        </td>

                        <td>
                            <img src="images/jiangxuan_1.jpg" alt="">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 899</font>
                        </td>

                        <td>
                            <img src="images/jiangxuan_1.jpg" alt="">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 899</font>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>

        <tr>
            <td>
                <img src="images/icon_6.jpg" alt="">
                黑马精选
                <hr color="#ffd700">
            </td>
        </tr>

        <tr>
            <td>
                <table align="center" width="95%">
                    <tr>
                        <td rowspan="2">
                            <img src="images/guonei_1.jpg" alt="">
                        </td>

                        <td>
                            <img src="images/jiangxuan_2.jpg" alt="" height="100%">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 699</font>
                        </td>

                        <td>
                            <img src="images/jiangxuan_2.jpg" alt="">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 699</font>
                        </td>

                        <td>
                            <img src="images/jiangxuan_2.jpg" alt="">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 699</font>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <img src="images/jiangxuan_2.jpg" alt="" height="100%">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 699</font>
                        </td>

                        <td>
                            <img src="images/jiangxuan_2.jpg" alt="">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 699</font>
                        </td>

                        <td>
                            <img src="images/jiangxuan_2.jpg" alt="">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 699</font>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>

        <tr>
            <td>
                <img src="images/icon_7.jpg" alt="">
                境外游
                <hr color="#ffd700">
            </td>
        </tr>

        <tr>
            <td>
                <table align="center" width="95%">
                    <tr>
                        <td rowspan="2">
                            <img src="images/jiangwai_1.jpg" alt="">
                        </td>

                        <td>
                            <img src="images/jiangxuan_3.jpg" alt="" height="100%">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 699</font>
                        </td>

                        <td>
                            <img src="images/jiangxuan_3.jpg" alt="">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 699</font>
                        </td>

                        <td>
                            <img src="images/jiangxuan_3.jpg" alt="">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 699</font>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <img src="images/jiangxuan_3.jpg" alt="" height="100%">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 699</font>
                        </td>

                        <td>
                            <img src="images/jiangxuan_3.jpg" alt="">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 699</font>
                        </td>

                        <td>
                            <img src="images/jiangxuan_3.jpg" alt="">
                            <p>上海飞三亚五天4晚自由行(春节销售+亲子+蜜月+自由行)</p>
                            <font color="red">&yen; 699</font>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr>
            <td>
                <img src="images/footer_service.png" alt="" width="100%">
            </td>
        </tr>
        <tr>
            <td align="center" bgcolor="#ffd700" height="40">
                <font color="gray" size="2">
                    江苏传智播客教育科技股份有限公司版权所有
                    Copyright 2006-2018&copy;,All Rights Reserved苏I CP备16007882
                </font>
                <img src="">
            </td>
        </tr>
    </table>
</body>
</html>
复制代码

结果：

 

 

 

 

实现HTML_旅游网站首页

 

posted on   淤泥不染  阅读(491)  评论(0)  编辑  收藏  举报
相关博文：
· 案例_黑马旅游网_页眉部分和案例_黑马旅游网_页面布局
· Bootstrap_插件_轮播图和案例_黑马旅游网_分析
· HTML标签综合案例分析与实现
· HTML标签_综合案例_分析与HTML标签_综合案例_实现
· HTML标签综合案例的分析与实践
阅读排行：
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码，我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了，比商业数据库还牛
· 白话解读 Dapr 1.15：你的「微服务管家」又秀新绝活了
· 上周热点回顾（2.24-3.2）
< 2025年3月 >
日 一 二 三 四 五 六
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

Copyright © 2025 淤泥不染
Powered by .NET 9.0 on Kubernetes Powered By博客园
点击右上角即可分享
微信分享提示