時間:2023-10-11 17:42:01 | 來源:網(wǎng)站運營
時間:2023-10-11 17:42:01 來源:網(wǎng)站運營
HTML5期末大作業(yè):網(wǎng)上花店網(wǎng)站設(shè)計——簡約的網(wǎng)上花店網(wǎng)站設(shè)計(4頁) HTML+CSS+JavaScript 學(xué)生DW網(wǎng)頁設(shè)計作業(yè)成品 web課程設(shè)計網(wǎng)頁規(guī)劃與設(shè)計 計算機畢設(shè)網(wǎng)頁設(shè)計源碼:常見網(wǎng)頁設(shè)計作業(yè)題材有個人、 美食、 公司、 學(xué)校、 旅游、 電商、 寵物、 電器、 茶葉、 家居、 酒店、 舞蹈、 動漫、 明星、 服裝、 體育、 化妝品、 物流、 環(huán)保、 書籍、 婚紗、 軍事、 游戲、 節(jié)日、 戒煙、 電影、 攝影、 文化、 家鄉(xiāng)、 鮮花、 禮品、 汽車、 其他
等網(wǎng)頁設(shè)計題目,A+水平作業(yè)
, 可滿足大學(xué)生網(wǎng)頁大作業(yè)網(wǎng)頁設(shè)計需求, 喜歡的可以下載!
PC電腦端關(guān)注我們
1.網(wǎng)頁作品簡介
:HTML期末大學(xué)生網(wǎng)頁設(shè)計作業(yè) A+水平 ,喜歡的可以下載,文章頁支持手機PC響應(yīng)式布局。2.網(wǎng)頁作品編輯
:作品下載后可使用任意HTML編輯軟件(如:DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++
等任意HTML軟件編輯修改網(wǎng)頁)。3.網(wǎng)頁作品技術(shù)
:Div+CSS、鼠標(biāo)滑過特效、Table、導(dǎo)航欄效果、banner、表單、二級三級頁面等,視頻、 音頻元素 、Flash,同時設(shè)計了logo(源文件),基本期末作業(yè)所需的知識點全覆蓋。<!doctype html><!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]--><!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]--><!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]--><!--[if (gte IE 9)|!(IE)]><!--><!--條件注釋語句,當(dāng)滿足if語句時則執(zhí)行--><html lang="en"><!--<![endif]--><head><meta charset="utf-8"><!--編碼格式--><title>XXX花店-首頁</title><!--引用js文件--><script src="js/jquery-1.8.2.min.js"></script><script src="js/common.js"></script><script src="js/jquery.easing.1.3.js"></script><script src="js/ddsmoothmenu.js"></script><script src="js/jquery.flexslider.js"></script><script src="js/jquery.elastislide.js"></script><script src="js/jquery.jcarousel.min.js"></script><script src="js/jquery.accordion.js"></script><script src="js/light_box.js"></script><script type="text/javascript">$(document).ready(function(){$(".inline").colorbox({inline:true, width:"50%"});});</script><!--end js--><!-- 適配于手機瀏覽 ================================================== --><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"><!-- CSS ================導(dǎo)入外部樣式表================================== --><!--可以在<head>部分通過<style>標(biāo)簽定義內(nèi)部樣式表;當(dāng)樣式需要被應(yīng)用到很多頁面的時候,外部樣式表將是理想的選擇。使用外部樣式表,就可以通過更改一個文件來改變整個站點的外觀--><link rel="stylesheet" href="css/style.css"><link rel="stylesheet" href="css/orange.css"><link rel="stylesheet" href="css/skeleton.css"><link rel="stylesheet" href="css/layout.css"><link rel="stylesheet" href="css/ddsmoothmenu.css"/><link rel="stylesheet" href="css/elastislide.css"/><link rel="stylesheet" href="css/home_flexslider.css"/><link rel="stylesheet" href="css/light_box.css"/><script src="js/html5.js"></script><!--[if IE]><script src="js/html5.js"></script><![endif]--><!--[if lt IE 9]> <script src="js/html5.js"></script> <![endif]--></head><body> <div class="mainContainer big container"><!--主要內(nèi)容區(qū)--> <!--Header Block--> <div class="header-wrapper"> <header class="container"> <div class="head-right"> <ul class="top-nav"> <li class=""><a href="#">我的賬戶</a></li> <li class="my-wishlist"><a href="#">收藏</a></li> <li class="checkout"><a href="#" >結(jié)算</a></li> <li class="log-in"><a href="account_login.html" >登錄</a></li> </ul> <section class="header-bottom"><!--搜索和購物車--> <!--section新標(biāo)簽,與div類似,語義化--> <div class="cart-block"><!--購物車--> <ul> <li>(2)</li> <li><a href="#" title="購物車"><img title="購物車" alt="購物車" src="picture/item_icon.png" /></a></li> <li>購物車</li> </ul> <div id="minicart" class="remain_cart" style="display: none;"> <p class="empty">您的購物車共有2件商品</p> <ol> <li> <div class="img-block"><img src="picture/small_img1.png" title="" alt="" /></div> <div class="detail-block"> <h4><a href="#" title="玫瑰">玫瑰</a></h4> <p> <strong>1</strong> x ¥99.00 <!--strong用于文本加粗,強調(diào)作用--> </p> <a href="#" title="Details">細(xì)節(jié)展示</a> </div> <div class="edit-delete-block"> <a href="#" title="Edit"><img src="picture/edit_icon.png" alt="Edit" title="Edit" /></a> <!--<img>中“alt”當(dāng)瀏覽器無法加載圖片時顯示替代文本的屬性--> <a href="#" title="Remove"><img src="picture/delete_item_btn.png" alt="Remove" title="Remove" /></a> </div> </li> <li> <div class="img-block"><img src="picture/small_img.png" title="" alt="" /></div> <div class="detail-block"> <h4><a href="#" title="玫瑰">玫瑰</a></h4> <p> <strong>1</strong> x ¥99.00 </p> <a href="#" title="Details">細(xì)節(jié)展示</a> </div> <div class="edit-delete-block"> <a href="#" title="Edit"><img src="picture/edit_icon.png" alt="Edit" title="Edit" /></a> <a href="#" title="Remove"><img src="picture/delete_item_btn.png" alt="Remove" title="Remove" /></a> </div> </li> <li> <div class="total-block">共計:<span>¥198.00</span></div> <a href="index.html" title="結(jié)算" class="orange-btn">結(jié)算</a> <!--<div class="clear"></div>--> </li> </ol> </div> </div> <!--搜索框--> <div class="search-block"> <input type="text" value="搜索" /> <!--定義單行的輸入字段,用戶可在其中輸入文本。默認(rèn)寬度為 20 個字符。 并不是所有的主流瀏覽器都支持新的input類型。--> <input type="submit" value="submit"/> <!--submit定義提交按鈕。提交按鈕會把表單數(shù)據(jù)發(fā)送到服務(wù)器--> </div> </section> </div> <!--LOGO--> <h1 class="logo"> <img title="Logo" alt="Logo" src="picture/logo.png" /></h1> <nav id="smoothmenu1" class="ddsmoothmenu mainMenu"> <!--nav標(biāo)簽定義導(dǎo)航鏈接的部分,是H5的新標(biāo)簽,優(yōu)點是語義化--> <ul id="nav"> <!--無序列表--> <li class="active"><a href="index.html">首頁</a></li> <li ><a href="category.html">全部商品</a></li> <li><a href="contact_us.html">留言板</a></li> </ul> </nav> <!--響應(yīng)式導(dǎo)航菜單--> <div class="mobMenu"> <h1> <span>菜單</span> <a class="menuBox highlight" href="javascript:void(0);"></a> <!--javascript:void(0)空鏈接,沒有跳轉(zhuǎn)--> <span class="clearfix"></span> <!--清除浮動對后面元素的影響--> </h1> <div id="menuInnner" style="display:none;"> <!--設(shè)置默認(rèn)狀態(tài)是不顯示--> <ul class="accordion"><!--accordion:可折疊的--> <!--無序列表--> <li class="active"><a href="index.html" >首頁</a></li> <li class="parent"><a href="category.html" >全部商品</a></li> <li class=""><a href="contact_us.html" >留言板</a></li> <span class="clearfix"></span> </ul> </div> </div> </div> <!--Banner Block--> <section class="banner-wrapper"> <div class="banner-block container"> <div class="flexslider"><!--調(diào)用框架接口--> <ul class="slides"> <li><img title="Banner" alt="Banner" src="picture/banner1.png" /></li> <li><img title="Banner" alt="Banner" src="picture/banner2.png" /></li> <li><img title="Banner" alt="Banner" src="picture/banner3.png" /></li> <li><img title="Banner" alt="Banner" src="picture/banner4.png" /></li> </ul> </div> <ul class="banner-add"> <li class="add1"><a href="#" title=""><img title="add1" alt="add1" src="picture/banner_add1.png" /></a></li> <li class="add2"><a href="#" title=""><img title="add2" alt="add2" src="picture/banner_add2.png" /></a></li> <li><a href="#">新聞中心</a></li> <li><a href="#">幫助</a></li> <li><a href="#">服務(wù)條款</a></li> </ul> <ul> <li class="link-title"><a href="#">我們的實力</a></li> <li class="aboutus-block">本店商品已向全國2603個區(qū)縣提供自營配送服務(wù),支持貨到付款、POS機刷卡和售后上門服務(wù),讓您購物無憂! <a href="#">更多</a> </li> </ul> </div> <div class="footer-bottom-block"> <ul class="bottom-links"> <li><a href="index.html">首頁</a></li> <li><a href="contact_us.html">留言板</a></li> </ul> <p class="copyright-block">Copyright © 2020.XXX花店 All rights reserved.</p> </div> </footer> </section></body></html>
web前端 零基礎(chǔ)-入門到高級 (視頻+源碼+開發(fā)軟件+學(xué)習(xí)資料+面試題) 一整套 (教程)
適合入門到高級的童鞋們?nèi)胧謣送1000套HTML+CSS+JavaScript模板網(wǎng)站
HTML5期末考核大作業(yè)源碼
包含 個人、 美食、 公司、 學(xué)校、 旅游、 電商、 寵物、 電器、 茶葉、 家居、 酒店、 舞蹈、 動漫、 明星、 服裝、 體育、 化妝品、 物流、 環(huán)保、 書籍、 婚紗、 軍事、 游戲、 節(jié)日、 戒煙、 電影、 攝影、 文化、 家鄉(xiāng)、 鮮花、 禮品、 汽車、 其他
* 可滿足大學(xué)生網(wǎng)頁大作業(yè)網(wǎng)頁設(shè)計需求, 喜歡的可以下載! 關(guān)鍵詞:設(shè)計,簡約,作業(yè)
微信公眾號
版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。