2020黑马旅游网项目素材及源码(无废话版)
生活随笔
收集整理的這篇文章主要介紹了
2020黑马旅游网项目素材及源码(无废话版)
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
一、成品展示
二、素材下載
鏈接：https://pan.baidu.com/s/1HOmZt-Di53LHeNHR0fl3-g
提取碼：eixh
三、代碼
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>黑馬旅游網(wǎng)</title> </head> <body><table width="100%" align="center"><!--1--><tr><td><img src="黑馬旅游網(wǎng)_files/top_banner.jpg" width="100%"></td></tr><!--2--><!--搜索框及l(fā)ogo--><tr><table width="100%" align="center"><td><img src="黑馬旅游網(wǎng)_files/logo.jpg" alt=""></td><td><img src="黑馬旅游網(wǎng)_files/search.png" alt=""></td><td><img src="黑馬旅游網(wǎng)_files/hotel_tel.png" alt=""></td></table></tr><!--3--><!--目錄--><tr><td><table align="center" width="100%" cellspacing="0" cellpadding="0"><tr bgcolor="#bdb76b" align="center" height="45" ><td>首頁</td><td>門票</td><td>酒店</td><td>香港車票</td><td>國內(nèi)游</td><td>出境游</td><td>港澳游</td><td>抱團(tuán)定制</td><td>全球自由行</td><td>收藏排行</td></tr></table></td></tr><!--4--><!--大圖--><tr><td><table><tr><td><img src="黑馬旅游網(wǎng)_files/banner_3.jpg"></td></tr></table></td></tr><!--5--><!--黑馬精選橫線--><tr><td><table width="100%" align="center"><tr><td><img src="黑馬旅游網(wǎng)_files/icon_5.jpg">黑馬精選<hr align="center" color="yellow" ></td></tr></table></td></tr><!--6--><!--黑馬精選內(nèi)容--><tr><td><table align="center" width="95%"><tr><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_1.jpg"><p><font>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</font></p></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_1.jpg"><p><font>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</font></p></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_1.jpg"><p><font>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</font></p></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_1.jpg"><p><font>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</font></p></td></tr></table></td></tr><!--7--><!--國內(nèi)游的橫線--><tr><table width="100%" align="center"><td><img src="黑馬旅游網(wǎng)_files/icon_6.jpg">國內(nèi)游<hr align="center" color="yellow" width="100%"></td></table></tr><!--8--><!--國內(nèi)游的內(nèi)容--><tr><td><table width="95%" align="center"><tr><td rowspan="2"><img src="黑馬旅游網(wǎng)_files/guonei_1.jpg" height="100%"></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_2.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">¥ 699</font></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_2.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">¥ 699</font></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_2.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">¥ 699</font></td></tr><tr><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_2.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">¥ 699</font></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_2.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">¥ 699</font></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_2.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">¥ 699</font></td></tr></table></td></tr><!--9--><!--境外游的橫線--><tr><td><table width="100%" align="center"><tr><td><img src="黑馬旅游網(wǎng)_files/icon_7.jpg">境外游<hr color="yellow" align="center"></td></tr></table></td></tr><!--10--><!--境外游的內(nèi)容--><tr><td><table width="95%" align="center"><tr><td rowspan="2"><img src="黑馬旅游網(wǎng)_files/jiangwai_1.jpg" height="100%"></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_3.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">¥ 699</font></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_3.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">¥ 699</font></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_3.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">¥ 699</font></td></tr><tr><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_3.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">¥ 699</font></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_3.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">¥ 699</font></td><td><img src="黑馬旅游網(wǎng)_files/jiangxuan_3.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">¥ 699</font></td></tr></table></td></tr><!--11--><!--認(rèn)證商標(biāo)--><tr><td><table width="100%" align="center"><tr><td><img src="黑馬旅游網(wǎng)_files/footer_service.png"></td></tr></table></td></tr><!--12--><!--頁尾--><tr><td><table width="100%" align="center"><tr><td bgcolor="#d2691e" align="center" height="50"><font color="#696969" size="2">越來越牛的猿 版權(quán)所有Copyright 2006-2020, All Rights Reserved<a href="">京ICP備18021256號(hào)</a></font></td></tr></table></td></tr></table> </body> </html>第二版用BootStrap完成
<!DOCTYPE html> <html lang="zh-CN"> <head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><!-- 上述3個(gè)meta標(biāo)簽*必須*放在最前面，任何其他內(nèi)容都*必須*跟隨其后！ --><title>Bootstrap 101 Template</title><!-- Bootstrap --><link href="bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet"><!-- jQuery (Bootstrap 的所有 JavaScript 插件都依賴 jQuery，所以必須放在前邊) --><script src="bootstrap-3.3.7-dist/js/jquery-3.5.1.min.js"></script><!-- 加載 Bootstrap 的所有 JavaScript 插件。你也可以根據(jù)需要只加載單個(gè)插件。 --><script src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script><style>.paddtop{padding-top: 20px;}.search-input{float: left;width: 400px;height: 35px;border: 2px yellow solid;}.search-btn{width: 90px;}.handpick{border-bottom: 2px yellow solid;padding: 10px;}.company{height: 40px;background: yellow;text-align: center;line-height: 40px;border: yellow 2px solid;}</style> </head> <body><!--頁眉--><div class="container-fluid"><div class="row"><img src="黑馬旅游網(wǎng)_files/top_banner.jpg" class="img-responsive" width="100%"></div><div class="row"><div class="col-md-3"><img src="黑馬旅游網(wǎng)_files/logo%20(1).jpg"></div><div class="col-md-5 paddtop"><input placeholder="請(qǐng)輸入路線名稱" class="search-input"><a href="#" class="btn btn-warning search-btn">搜索</a></div><div class="col-md-4"><img src="黑馬旅游網(wǎng)_files/hotel_tel.png"></div></div><!--導(dǎo)航欄--><div class="row"><nav class="navbar navbar-default"><div class="container-fluid"><!-- Collect the nav links, forms, and other content for toggling --><div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"><ul class="nav navbar-nav"><li><a href="#">傳智播客<span class="sr-only">(current)</span></a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li><li><a href="#">JavaEE</a></li></ul></div><!-- /.navbar-collapse --></div><!-- /.container-fluid --></nav></div><!--輪播圖--><div class="row"><div id="carousel-example-generic" class="carousel slide" data-ride="carousel"><!-- Indicators --><ol class="carousel-indicators"><li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li><li data-target="#carousel-example-generic" data-slide-to="1"></li><li data-target="#carousel-example-generic" data-slide-to="2"></li></ol><!-- Wrapper for slides --><div class="carousel-inner" role="listbox"><div class="item active"><img src="黑馬旅游網(wǎng)_files/banner_1.jpg" width="100%" alt="..."><div class="carousel-caption">...</div></div><div class="item"><img src="黑馬旅游網(wǎng)_files/banner_2.jpg" width="100%" alt="..."><div class="carousel-caption">...</div></div><div class="item"><img src="黑馬旅游網(wǎng)_files/banner_3.jpg" width="100%" alt="..."><div class="carousel-caption">...</div></div></div><!-- Controls --><a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span><span class="sr-only">Previous</span></a><a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span><span class="sr-only">Next</span></a></div></div></div> <!--內(nèi)容部分--><!--黑馬精選--><div class="container"><div class="row handpick"><span><img src="黑馬旅游網(wǎng)_files/icon_5.jpg">黑馬精選</span></div><!--paddtop是離上邊距10px--><div class="row paddtop"><div class="col-md-3"><div class="thumbnail"><img src="黑馬旅游網(wǎng)_files/jiangxuan_1.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">￥699</font></div></div><div class="col-md-3"><div class="thumbnail"><img src="黑馬旅游網(wǎng)_files/jiangxuan_1.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">￥699</font></div></div><!--thumbnail相框--><div class="col-md-3"><div class="thumbnail"><img src="黑馬旅游網(wǎng)_files/jiangxuan_1.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">￥699</font></div></div><div class="col-md-3"><div class="thumbnail"><img src="黑馬旅游網(wǎng)_files/jiangxuan_1.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">￥699</font></div></div></div><!--國內(nèi)游--><div class="row"><div class="row handpick"><span><img src="黑馬旅游網(wǎng)_files/icon_6.jpg">國內(nèi)游</span></div><!--分為兩部分--><!--第一部分大圖占4個(gè)格--><div class="col-md-4 paddtop"><img src="黑馬旅游網(wǎng)_files/guonei_1.jpg"></div><!--第二部分共占8格，分為兩行--><div class="col-md-8 paddtop"><div class="row"><div class="col-md-4"><div class="thumbnail"><img src="黑馬旅游網(wǎng)_files/jiangxuan_2.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">￥899</font></div></div><div class="col-md-4"><div class="thumbnail"><img src="黑馬旅游網(wǎng)_files/jiangxuan_2.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">￥899</font></div></div><div class="col-md-4"><div class="thumbnail"><img src="黑馬旅游網(wǎng)_files/jiangxuan_2.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">￥899</font></div></div></div><div class="row"><div class="col-md-4"><div class="thumbnail"><img src="黑馬旅游網(wǎng)_files/jiangxuan_2.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">￥899</font></div></div><div class="col-md-4"><div class="thumbnail"><img src="黑馬旅游網(wǎng)_files/jiangxuan_2.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">￥899</font></div></div><div class="col-md-4"><div class="thumbnail"><img src="黑馬旅游網(wǎng)_files/jiangxuan_2.jpg"><p>上海直飛三亞5天4晚自由行(春節(jié)預(yù)售+親子/蜜月/休閑游首選+豪華酒店任選+接送機(jī))</p><font color="red">￥899</font></div></div></div></div></div></div><!--頁尾--><div class="container-fluid"><div class="row"><img src="黑馬旅游網(wǎng)_files/footer_service.png" class="img-responsive"></div><div class="row company">越來越牛的猿 版權(quán)所有Copyright 2006-2020, All Rights Reserved 京ICP備18021256號(hào)</div></div> </body> </html>總結(jié)
以上是生活随笔為你收集整理的2020黑马旅游网项目素材及源码(无废话版)的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 诺顿序列号获取方法
- 下一篇： 基于网络中心性的计算机网络脆弱性评估方法