HTML5期末大作業：旅游網頁設計——旅游住宿酒店(14頁) HTML+CSS+JavaScript 學生DW網頁設計作業成品 web課程設計網頁規劃與設計 大學生畢設網頁設計原始碼HTML
常見網頁設計作業題材有
個人、 美食、 公司、 學校、 旅游、 電商、 寵物、 電器、 茶葉、 家居、 酒店、 舞蹈、 動漫、 明星、 服裝、 體育、 化妝品、 物流、 環保、 書籍、 婚紗、 軍事、 游戲、 節日、 戒煙、 電影、 攝影、 文化、 家鄉、 鮮花、 禮品、 汽車、 其他等網頁設計題目,A+水平作業, 可滿足大學生網頁大作業網頁設計需求, 喜歡的可以下載!
作品介紹
1.網頁作品簡介 ：學生HTML個人網頁作業 A+水平 ,喜歡的可以下載，文章頁支持手機PC回應式布局，
2.網頁作品編輯：此作品為學生期末大作業網頁設計題材，代碼為簡單學生水平 html+css 布局制作，作品下載后可使用任意HTML編輯軟體（例如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML軟體編輯修改網頁），
3.網頁作品布局：網頁布局整體為回應式布局、LOGO、導航、主體內容布局，子頁面多種布局，興趣愛好內容使用圖片串列布局，成績頁面插入了表格，聯系我們使用圖片對齊方式設定了左對齊，
4.網頁作品技術：使用DIV+CSS制作網頁, 背景圖、音樂、視頻、flash、滑鼠經過及選中導航變色效果、下劃線 、等， 表單提交、評論留言，并使用JavaScript制作了表單判斷（提交時表單不能為空），
文章目錄
- HTML5期末大作業：旅游網頁設計——旅游住宿酒店(14頁) HTML+CSS+JavaScript 學生DW網頁設計作業成品 web課程設計網頁規劃與設計 大學生畢設網頁設計原始碼HTML
- 作品介紹
- 一、作品展示
- 二、檔案目錄
- 三、代碼實作
- 四、web前端(學習資料)
- 五、原始碼獲取
一、作品展示
二、檔案目錄
三、代碼實作
<html><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>聯系我們_旅游住宿農家樂類()</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="style/style.css" rel="stylesheet">
<script src="js/jquery.js" ></script>
<script src="js/jquery.superslide.2.1.1.js" ></script>
<script src="js/search.js" ></script>
<script src="js/nav.js" ></script>
<script src="js/jqselect.js" ></script>
<script src="js/jquery.validator.js" ></script>
<script src="js/zh_cn.js" ></script>
<script src="js/mobile.js" ></script>
</head>
<body>
<!--頂部開始-->
<div class="top_bg">
<div class="top"> <a href="index.htm" title="旅游住宿農家樂類()" class="logo"> <img src="images/logo.png" alt="旅游住宿農家樂類()"></a>
<div class="toptel">
<div class="tel">服務熱線：<span>+86-0000-96877</span></div>
</div>
</div>
</div>
<!--頂部結束-->
<!--導航開始-->
<div class="nav_bg">
<ul class="nav">
<li><a title="網站首頁" href="index.htm" >網站首頁</a> </li>
<li><a title="景點介紹" href="index-1.htm" >景點介紹</a>
<dl>
</dl>
</li><li><a title="客房展示" href="index-2.htm" >客房展示</a>
<dl>
<dd><a title="標準間" href="index-3.htm" >標準間</a></dd>
<dd><a title="多人間" href="index-4.htm" >多人間</a></dd>
<dd><a title="雙人間" href="index-5.htm" >雙人間</a></dd>
<dd><a title="商務間" href="index-6.htm" >商務間</a></dd>
</dl>
</li><li><a title="景點新聞" href="index-7.htm" >景點新聞</a>
<dl>
</dl>
</li><li><a title="路線推薦" href="index-8.htm" >路線推薦</a>
<dl>
</dl>
</li><li><a title="農家大院" href="index-9.htm" >農家大院</a>
<dl>
</dl>
</li><li><a title="特色美食" href="index-10.htm" >特色美食</a>
<dl>
</dl>
</li><li><a title="活動專題" href="index-11.htm" >活動專題</a>
<dl>
</dl>
</li><li><a title="在線留言" href="index-12.htm" >在線留言</a>
<dl>
</dl>
</li><li><a title="聯系我們" href="index-13.htm" >聯系我們</a>
<dl>
</dl>
</li>
</ul>
</div>
<!--導航結束-->
<div class="banner">
<div class="banner_top"></div>
<!--幻燈片大圖開始-->
<div id="slideBox" class="slideBox">
<div class="bd">
<ul>
<li style="background: url(images/banner1.jpg) center center no-repeat;"><a href="#"><img src="images/no.gif" /></a></li>
<li style="background: url(images/banner1.jpg) center center no-repeat;"><a href="#"><img src="images/no.gif" /></a></li>
</ul>
</div>
<div class="hd">
<ul>
<li></li>
<li></li>
</ul>
</div>
<a href="javascript:void(0)" class="prev"></a> <a href="javascript:void(0)" class="next"></a> </div>
<script src="js/banner.js" ></script>
<!--幻燈片大圖結束-->
</div>
<div class="marquee_box">
<div class="marquee_bg">
<div class="marquee_center">
<!--網站公告開始-->
<div class="mar_left">
<p>站內公告：</p>
<marquee scrollamount="3">
誠信為本：市場永遠在變，誠信永遠不變，
</marquee>
</div>
<!--網站公告結束-->
<!--搜索欄開始-->
<div class="search">
<form name="formsearch" action="http://demo3805.zancms.com/plus/search.php" method="get" onsubmit="return checksearch(this)">
<input type="hidden" name="kwtype" value="0" />
<input class="text" type="text" name="q" value="請輸入關鍵字" onfocus="if(this.value==defaultValue)this.value=''" onblur="if(this.value=='')this.value=defaultValue">
<input type="submit" title="搜索" class="btn pngFix" value=""/>
</form>
<script type=text/javascript>
jQuery(document).ready(function() {
jQuery("#rid").selectbox();
});
</script>
</div>
<!--搜索欄結束-->
</div>
</div>
</div>
<div class="con_bg">
<div class="subpage"> <div class="left">
<!--客房分類開始-->
<div class="left_title"><span>客房展示</span>
<p>GUEST ROOM</p>
</div>
<ul class="left-nav">
<li>
<p><a href="index-3.htm" title="標準間">標準間</a></p>
</li>
<li>
<p><a href="index-4.htm" title="多人間">多人間</a></p>
</li>
<li>
<p><a href="index-5.htm" title="雙人間">雙人間</a></p>
</li>
<li>
<p><a href="index-6.htm" title="商務間">商務間</a></p>
</li>
</ul>
<!--客房分類結束-->
<!--聯系我們開始-->
<div class="left-contact"> <img src="images/leftcontact.jpg" width="226" height="170" alt="">
<div class="left-contact-con">
<p>歡迎您的到來！</p>
<div>+86-0000-96877</div>
</div>
</div>
<!--聯系我們結束-->
<!--景點新聞開始-->
<div class="left_title2"><span>景點新聞</span><a href="index-7.htm" title="更多">>更多</a> </div>
<ul class="left-line">
<li><a href="15.html" title="怎么更換C級防盜門鎖芯" >怎么更換C級防盜門鎖芯</a></li>
<li><a href="14.html" title="開鎖需要什么證件" >開鎖需要什么證件</a></li>
<li><a href="13.html" title="汽車防盜報警器" >汽車防盜報警器</a></li>
<li><a href="12.html" title="防盜門開鎖后必須換鎖嗎?" >防盜門開鎖后必須換鎖嗎?</a></li>
<li><a href="11.html" title="中國鎖具業該如何應對國際競爭" >中國鎖具業該如何應對國際競爭</a></li>
</ul>
<!--景點新聞結束-->
</div>
<div class="right">
<div class="right-title">
<div class="right-name"><span>景</span><font>聯系我們</font></div>
<p>當前位置：<a href="index.htm" >主頁</a> > <a href="index-13.htm" >聯系我們</a></p>
</div>
<!--單頁內容開始-->
<div class="right_con">
<div class="pb">
<div class="pagebox">
<p style="text-indent: 2em;"><p>
地址：這里是您的公司地址<br />
電話：+86-0000-96877<br />
傳真：+86-0000-96877<br />
郵編：000000<br />
郵箱：這里是您公司的郵箱地址 </p>
</p>
<div align="center"></div>
</div>
</div>
</div>
<!--單頁內容結束-->
</div>
</div>
<img src="images/con_bottom.jpg" class="con_bottom"></div>
<!--底部導航開始-->
<div class="foot_nav"> <a href="index.htm" title="首頁">首頁</a> <span>|</span> <a title="景點介紹" href="index-1.htm" >景點介紹</a>
</li>
<span>|</span> <a title="客房展示" href="index-2.htm" >客房展示</a>
</li>
<span>|</span> <a title="景點新聞" href="index-7.htm" >景點新聞</a>
</li>
<span>|</span> <a title="路線推薦" href="index-8.htm" >路線推薦</a>
</li>
<span>|</span> <a title="農家大院" href="index-9.htm" >農家大院</a>
</li>
<span>|</span> <a title="特色美食" href="index-10.htm" >特色美食</a>
</li>
<span>|</span> <a title="活動專題" href="index-11.htm" >活動專題</a>
</li>
<span>|</span> <a title="在線留言" href="index-12.htm" >在線留言</a>
</li>
<span>|</span> <a title="聯系我們" href="index-13.htm" >聯系我們</a>
</li>
<span>|</span> </div>
<!--底部導航結束-->
<!--頁尾開始-->
<div class="foot_bg">
<div class="foot">
<div class="foot_left">
<div class="foot-left-top">
<h1>+86-0000-96877</h1>
<!--分享代碼開始-->
<div id="pgshare1">
<div id="bdshare" class="bdshare_t bds_tools get-codes-bdshare"> <a class="bds_tsina"></a> <a class="bds_tqq"></a> <a class="bds_qzone"></a> <a class="bds_bdhome"></a> </div>
</div>
<script type="text/javascript" id="bdshare_js" data="type=tools" ></script>
<script type="text/javascript" id="bdshell_js"></script>
<script type="text/javascript">
document.getElementById("bdshell_js").src = "http://bdimg.share.baidu.com/static/js/shell_v2.js?cdnversion=" + Math.ceil(new Date()/3600000)
</script>
<!--分享代碼結束-->
</div>
<div class="foot-fonts">
<p>2002-2011 某某旅館住宿有限公司 著作權所有</p>
<p><span>地址：這里是您的公司地址</span><span>電話：+86-0000-96877</span><span>手機：+86-0000-96877</span></p>
<p><span>技術支持：<a href="#" target="_blank" title="織夢58" >網路公司</a></span><span>ICP備案編號：<a href="javascript:if(confirm('http://www.miitbeian.gov.cn/ \n\n�?���δ�� Teleport Pro ?�?���? �������·��������?��?�����??�Χ�� \n\n��?�?������?�����'))window.location='http://www.miitbeian.gov.cn/'" target="_blank" title="ICP備********號">ICP備********號</a></span>統計代碼放置</p>
</div>
</div>
<div class="foot_code"><img src="images/erweima.png" width="101" height="101" alt="微信掃一掃"/>
<p>微信掃一掃</p>
</div>
</div>
</div>
<!--頁尾結束-->
<!--回傳頂部開始-->
<div id="common-tool" >
<ul>
<li><a id="common-sweep-ico" href="javascript:void(0);"><img src="images/sweep-ico.png" alt="二維碼" title="二維碼"></a>
<div class="common-sweep-box"> <img src="images/erweima.png" alt="這里是您的網站名稱"/></div>
</li>
<li><a href="index-12.htm" ><img src="images/book-ico.png" alt="在線留言" title="在線留言"></a></li>
<li><a href="javascript:if(confirm('http://wpa.qq.com/msgrd?v=3&uin=12345678&site=qq&menu=yes \n\n�?���δ�� Teleport Pro ?�?���? �������·��������?��?�����??�Χ�� \n\n��?�?������?�����'))window.location='http://wpa.qq.com/msgrd?v=3&uin=12345678&site=qq&menu=yes'" ><img src="images/qq-ico.png" alt="在線QQ" title="在線QQ"></a></li>
<li id="common-top-ico"><a class="common-top" href="javascript:void(0);"><img src="images/top-ico.png" alt="回傳頂部" title="回傳頂部"></a></li>
</ul>
</div>
<!--回傳頂部結束-->
<!--彈窗插件開始-->
<link rel="stylesheet" type="text/css" href="jquery.dialogbox.css" >
<div id="type-dialogBox"></div>
<script src="js/jquery.dialogbox.js" ></script>
<!--彈窗插件結束-->
<script type="text/javascript" src="su.js" ></script>
</body>
</html>
四、web前端(學習資料)
web前端 零基礎-入門到高級 (視頻+原始碼+開發軟體+學習資料+面試題) 一整套 (教程)
適合入門到高級的童鞋們入手~送1000套HTML+CSS+JavaScript模板網站
五、原始碼獲取
?1.看到這里了就 [點贊+好評+收藏] 三連 支持下吧，你的 「點贊，好評，收藏」是我創作的動力，
? 2.關注我 ~ 每天帶你學習 :各種前端插件、七夕表白網頁制作、3D炫酷效果、圖片展示、文字效果、以及整站模板 、大學生畢業HTML模板 、web期末大作業模板 、等! 「 前后開發者，一起探討 前端，JAVA ，Node 知識，互相學習」！
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/328025.html
標籤：其他
上一篇：vue基礎指令