国产成人精品无码青草_亚洲国产美女精品久久久久∴_欧美人与鲁交大毛片免费_国产果冻豆传媒麻婆精东

15158846557 在線咨詢 在線咨詢
15158846557 在線咨詢
所在位置: 首頁 > 營銷資訊 > 網(wǎng)站運營 > HTML5期末大作業(yè):家鄉(xiāng)網(wǎng)站設計——我的家鄉(xiāng)——浙江文化(4頁) HTML+CSS+JavaScri

HTML5期末大作業(yè):家鄉(xiāng)網(wǎng)站設計——我的家鄉(xiāng)——浙江文化(4頁) HTML+CSS+JavaScri

時間:2023-10-11 17:24:01 | 來源:網(wǎng)站運營

時間:2023-10-11 17:24:01 來源:網(wǎng)站運營

HTML5期末大作業(yè):家鄉(xiāng)網(wǎng)站設計——我的家鄉(xiāng)——浙江文化(4頁) HTML+CSS+JavaScript 家鄉(xiāng)主題HTM5網(wǎng)頁設計作業(yè)成品:

HTML5期末大作業(yè):家鄉(xiāng)網(wǎng)站設計——我的家鄉(xiāng)——浙江文化(4頁) HTML+CSS+JavaScript 家鄉(xiāng)主題HTM5網(wǎng)頁設計作業(yè)成品

常見網(wǎng)頁設計作業(yè)題材有 個人、 美食、 公司、 學校、 旅游、 電商、 寵物、 電器、 茶葉、 家居、 酒店、 舞蹈、 動漫、 明星、 服裝、 體育、 化妝品、 物流、 環(huán)保、 書籍、 婚紗、 軍事、 游戲、 節(jié)日、 戒煙、 電影、 攝影、 文化、 家鄉(xiāng)、 鮮花、 禮品、 汽車、 其他 等網(wǎng)頁設計題目, A+水平作業(yè), 可滿足大學生網(wǎng)頁大作業(yè)網(wǎng)頁設計需求, 喜歡的可以下載!

獲取更多源碼

PC電腦端關注我們

作者主頁-更多源碼

HTML期末大作業(yè)文章專欄

作品介紹

1.網(wǎng)頁作品簡介 :HTML期末大學生網(wǎng)頁設計作業(yè) A+水平 ,喜歡的可以下載,文章頁支持手機PC響應式布局。

2.網(wǎng)頁作品編輯:作品下載后可使用任意HTML編輯軟件(如:DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML軟件編輯修改網(wǎng)頁)。

3.網(wǎng)頁作品技術:Div+CSS、鼠標滑過特效、Table、導航欄效果、banner、表單、二級三級頁面等,視頻、 音頻元素 、Flash,同時設計了logo(源文件),基本期末作業(yè)所需的知識點全覆蓋。

@TOC

一、作品展示







二、文件目錄







三、代碼實現(xiàn)

<!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個meta標簽*必須*放在最前面,任何其他內(nèi)容都*必須*跟隨其后! --> <title>魅力蓉城</title> <!-- Bootstrap --> <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" href="css/index.css"> <!-- HTML5 shim 和 Respond.js 是為了讓 IE8 支持 HTML5 元素和媒體查詢(media queries)功能 --> <!-- 警告:通過 file:// 協(xié)議(就是直接將 html 頁面拖拽到瀏覽器中)訪問頁面時 Respond.js 不起作用 --> <!--[if lt IE 9]> <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script> <![endif]--> </head> <body> <nav class="navbar navbar-default"> <div class="container-fluid"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <span class="sr-only">Toggle navigation</span> </button> <a class="navbar-brand" href="index.html" target="_whitr">浙江杭州</a> </div> <!-- 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="scenery.html">美景介紹</a></li> <li><a href="food.html">特色美食</a></li> <li><a href="culture.html">地方文化</a></li> <li><a href="https://map.baidu.com/search/%E6%88%90%E9%83%BD%E5%B8%82/@11585451,3556256.75,12z?querytype=s&wd=%E6%88%90%E9%83%BD%E5%B8%82&c=75&provider=pc-aladin&pn=0&device_ratio=2&da_src=shareurl">地圖位置</a></li> </ul> <form class="navbar-form navbar-right"> <div class="form-group"> <input type="text" class="form-control" placeholder="Search"> </div> <button type="submit" class="btn btn-default">搜索更多</button> </form> </div><!-- /.navbar-collapse --> </div><!-- /.container-fluid --> </nav> <nav> <div class="jumbotron"> <div class="container"> <h1>魅力蓉城</h1> <p>杭州,一個來了就走不了的地方</p> <p> <a class="btn btn-primary btn-lg">了解更多</a> </p> </div> </div> </div> <div class="content"> <h1>魅力蓉城</h1> <hr> <!-- 輪播圖 --> <div id="myCarousel" class="carousel slide"> <!-- 輪播(Carousel)指標 --> <ol class="carousel-indicators"> <li data-target="#myCarousel" data-slide-to="0" class="active"></li> <li data-target="#myCarousel" data-slide-to="1"></li> <li data-target="#myCarousel" data-slide-to="2"></li> </ol> <!-- 輪播(Carousel)項目 --> <div class="carousel-inner"> <div class="item active"> <a href="scenery.html"> <img src="img/杭州風景1.jpg" alt="First slide"> </a> </div> <div class="item"> <a href="food.html"> <img src="img/杭州風景3.jpg" alt="Second slide"> </a> </div> <div class="item"> <a href="humanity.html"> <img src="img/杭州風景5.jpg" alt="Third slide"> </a> </div> </div> <!-- 輪播(Carousel)導航 --> <a class="carousel-control left" href="#myCarousel" data-slide="prev"> <span _ngcontent-c3="" aria-hidden="true" class="glyphicon glyphicon-chevron-left"></span> </a> <a class="carousel-control right" href="#myCarousel" data-slide="next"> <span _ngcontent-c3="" aria-hidden="true" class="glyphicon glyphicon-chevron-right"></span> </a> </div> <!-- thumbnail--><div class="container"> <div class="row"> <div class="col-md-3"> <div class="thumbnail"> <img src="img/杭州文化.jpg" alt="242*200"> <div class="caption"> <h1>杭州文化!</h1> <p>了解關于杭州這個地方的特殊文化!</p> <a class="btn btn-primary" href="culture.html">了解更多</a> </div> </div> </div> <div class="col-md-3"> <div class="thumbnail"> <img src="img/杭州美食1.jpg" alt="242*200"> <div class="caption"> <h1>杭州美食!</h1> <p>若能去杭州,先做好嘗遍各種美食的準備!</p> <a class="btn btn-primary"href="food.html">了解更多</a> </div> </div> </div> <div class="col-md-3"> <div class="thumbnail"> <img src="img/杭州風景5.jpg" alt="242*200"> <div class="caption"> <h1>杭州風景!</h1> <p>倚錦瑟,擊玉壺,吳中狂士游杭州,了解杭州的美景!</p> <a class="btn btn-primary" href="scenery.html">了解更多</a> </div> </div> </div><div class="col-md-3"> <div class="thumbnail"> <img src="img/杭州地圖.jpg" alt="242*200"> <div class="caption"> <h1>杭州位置!</h1> <p>點擊獲取杭州位置</p> <a class="btn btn-primary" href="https://map.baidu.com/search/%E6%88%90%E9%83%BD%E5%B8%82/@11585451,3556256.75,12z?querytype=s&wd=%E6%88%90%E9%83%BD%E5%B8%82&c=75&provider=pc-aladin&pn=0&device_ratio=2&da_src=shareurl">了解更多</a> </div> </div> </div> </div></div><footer class="footer"> <div class="container"> <div class="footerbar"> <div class="footerbar-header"> <p>魅力蓉城 天府之國</p> </div> <div class="footerbar-footer"> <p>2020@chendu</p> </div> </div> </div> </div></footer> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依賴 jQuery,所以必須放在前邊) --> <script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script> <!-- 加載 Bootstrap 的所有 JavaScript 插件。你也可以根據(jù)需要只加載單個插件。 --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script> <script> $(function(){ $('#myCarousel').carousel({ interval:2000, }) $('#myCarousel li').click(function(){ var index=$(this).attr("data-slide-to") $('#myCarousel').carousel(parseInt(index)) }) }) </script> </body></html>






四、獲取更多源碼

PC電腦端關注我們

五、學習資料

web前端 零基礎-入門到高級 (視頻+源碼+開發(fā)軟件+學習資料+面試題) 一整套 (教程) 適合入門到高級的童鞋們?nèi)胧謣送1000套HTML+CSS+JavaScript模板網(wǎng)站





六、更多源碼

HTML5期末考核大作業(yè)源碼 包含 個人、 美食、 公司、 學校、 旅游、 電商、 寵物、 電器、 茶葉、 家居、 酒店、 舞蹈、 動漫、 明星、 服裝、 體育、 化妝品、 物流、 環(huán)保、 書籍、 婚紗、 軍事、 游戲、 節(jié)日、 戒煙、 電影、 攝影、 文化、 家鄉(xiāng)、 鮮花、 禮品、 汽車、 其他* 可滿足大學生網(wǎng)頁大作業(yè)網(wǎng)頁設計需求, 喜歡的可以下載!



關鍵詞:家鄉(xiāng),浙江,文化,作業(yè),設計

74
73
25
news

版權所有? 億企邦 1997-2025 保留一切法律許可權利。

為了最佳展示效果,本站不支持IE9及以下版本的瀏覽器,建議您使用谷歌Chrome瀏覽器。 點擊下載Chrome瀏覽器
關閉