Web front end final assignment (imitating China cosmetics mall) html+css+javascript web design example enterprise website production
Near the end of the term, you are still designing your final homework for HTML web pages. Do you feel the teacher's homework requirements are great? Can't you start HTML web page homework? The total number of pages required is too much? No suitable template? And so on. The problems you want to solve can basically meet your needs in this blog post~
Original HTML+CSS+JS page design, web college students' web design homework source code, this is a good web page production, the picture is smart, and is very suitable for beginners to learn and use.
Introduction to works
1. Introduction to web works: HTML final college students' web design homework can be downloaded if they like. The article page supports mobile PC responsive layout.
2. Web page work editing: this work is the subject of web page design for students' final homework, and the code is simple student level html+css layout. After the work is downloaded, any HTML editing software can be used (for example, all editors of DW, HBuilder, NotePAD, vscade, Sublime and Webstorm can be used)
3. Web page work layout: the overall web page layout includes LOGO, navigation and main content layout. There are many layouts of sub pages. The contents of interests and hobbies use the picture list layout. The score page inserts a table. Contact us to set the left alignment using the picture alignment.
4. Web page work technology: CSS is used to make web page background, mouse passing, selected navigation color change effect, underline, etc. A message form is made on the home page, and a form judgment is made simply using JavaScript (the form cannot be empty when submitted)
1, Work demonstration
2, Code directory
3, Code implementation
<!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 name="baidu-site-verification" content="lp240rdBW8" />
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<title>home page</title>
<meta name="keywords" content="Cosmetics wholesale,Cosmetics consignment,Beauty mall,One for sale,Skin Care,Make up,Makeup tools"/>
<meta name="description" content="Cosmetics·China is a large-scale wholesale and consignment website for cosmetics, cosmetics and women's daily necessities in China. There are a large number of high, middle and low-grade products. You can start your e-commerce life without leaving home and gather cosmetics wholesale,Cosmetics consignment,Beauty mall,One for sale,Skin Care,Make up,Cosmetic tools wholesale and other supply and demand information."/>
<meta http-equiv="mobile-agent" content="format=xhtml; url=http://m.chinahzp.wang/">
<meta http-equiv="mobile-agent" content="format=html5; url=http://m.chinahzp.wang/">
<meta name="generator" content="Cosmetics B2B - www.chinahzp.wang"/>
<link rel="shortcut icon" type="image/x-icon" href="images/favicon.ico"/>
<link rel="bookmark" type="image/x-icon" href="images/favicon.ico"/>
<link rel="archives" title="Cosmetics[China]" href="http://chinahzp.wang/archiver/"/>
<link href="css/base.css" rel="stylesheet" type="text/css">
<link href="css/home_header.css" rel="stylesheet" type="text/css">
<link href="css/font-awesome.min.css" rel="stylesheet" />
<script src="js/jquery.js"></script>
<script src="js/jquery.ui.js"></script>
<!-- PublicHeadLayout Begin -->
<div class="header-wrap">
<header class="public-head-layout wrapper">
<h1 class="site-logo"><a href="index.html"><img src="images/logo.png" class="pngFix" title="China Cosmetics Network" alt="Cosmetics China"></a></h1>
<div class="head-app"><span class="pic"></span>
<div class="download-app">
<div class="qrcode"><img src="http://chinahzp.wang/mb_app.png" rel="nofollow"></div>
<div class="hint">
<h4>Scan QR code</h4>
Download mobile client</div>
<div class="addurl">
<a href=" " target="_blank" rel="nofollow"><i class="icon-android"></i>Android</a>
<a href=" " target="_blank" rel="nofollow"><i class="icon-apple"></i>iPhone</a>
</div>
</div>
</div>
<script type="text/javascript">var searchid = 5;</script>
<div class="head-search-bar search-form ">
<!--Goods and stores-->
<form id="destoon_search" action="sell.htmlsearch.php" class="search-form" onsubmit="return Dsearch();">
<input type="hidden" name="moduleid" value="5" id="destoon_moduleid"/>
<input type="hidden" name="spread" value="0" id="destoon_spread"/>
<div id="search">
<ul class="tab">
<li class="current" onclick="qymbModule(5, this);">Find the source of goods</li><li onclick="qymbModule(16, this);">One piece distribution area</li><li onclick="qymbModule(6, this);">Look, buy</li><li onclick="qymbModule(4, this);">wholesaler</li><li onclick="qymbModule(21, this);">Information circle</li><li onclick="qymbModule(22, this);">Recruitment agent</li> </ul>
<input name="kw" id="destoon_kw" type="text" class="input-text" value="Please enter keywords" onfocus="if(this.value=='Please enter keywords') this.value='';" onkeyup="STip(this.value);" autocomplete="off"/>
<input type="submit" value="search" class="input-submit"> </div>
</form>
<!--Search keywords-->
<div class="keyword">Popular search: <ul>
<li><a href="sell.htmlsearch.php?kw=%E4%B8%80%E4%BB%B6%E4%BB%A3%E9%94%80" rel="nofollow">One for sale</a></li>
<li><a href="sell.htmlsearch.php?kw=%E5%8C%96%E5%A6%86%E5%93%81" rel="nofollow">Cosmetics</a></li>
</ul>
</div>
</div>
<div class="head-user-menu">
<dl class="my-mall">
<dt><span class="ico"></span><a href="member_sell_add.html" rel="nofollow">Release source</a></dt>
</dl>
<dl class="my-cart">
<dt><span class="ico"></span><a href="cart.html" rel="nofollow">Purchase vehicle</a> (<span class="head_t" id="destoon_cart">0</span>)</dt>
</dl>
</div>
</header>
</div>
<!-- PublicHeadLayout End -->
<!-- publicNavLayout Begin -->
<nav class="public-nav-layout ">
<div class="wrapper">
<div class="all-category">
<div class="title"><i></i>
<h3><a href="http://chinahzp. Wang / sitemap / "> all categories</a></h3>
</div>
<div class="category">
<ul class="menu">
<li cat_id="470" class="even" >
<div class="class">
<span class="ico"><img src="images/category-pic-470.png"></span>
<h4><a href="list.htmllist-1.html">Skin care </a></h4>
<span class="recommend-class">
<a href="list.htmllist-17.html" target="_blank" title="See more sunscreen/skin whitening">Sunscreen/skin whitening</a>
<a href="list.htmllist-19.html" target="_blank" title="Check more mask/Face cream">Facial mask/Face cream</a>
<a href="list.htmllist-20.html" target="_blank" title="See more makeup removers/Cleansing">Remove makeup/Cleansing</a>
<a href="list.htmllist-23.html" target="_blank" title="See more toners/emulsion">emollient water/emulsion</a>
</span><span class="arrow"></span> </div>
<div class="sub-class" cat_menu_id="470">
<dl>
<dd class="goods-class">
<a href="list.htmllist-17.html" target="_blank" title="See more sunscreen/skin whitening">Sunscreen/skin whitening</a>
<a href="list.htmllist-19.html" target="_blank" title="Check more mask/Face cream">Facial mask/Face cream</a>
<a href="list.htmllist-20.html" target="_blank" title="See more makeup removers/Cleansing">Remove makeup/Cleansing</a>
<a href="list.htmllist-23.html" target="_blank" title="See more toners/emulsion">emollient water/emulsion</a>
<a href="list.htmllist-25.html" target="_blank" title="See more essence/essential oil">Essence/essential oil</a>
<a href="list.htmllist-26.html" target="_blank" title="See more acne/freckle removing">acne treatment/freckle removing</a>
<a href="list.htmllist-181.html" target="_blank" title="See more facial massages">Facial massage</a>
<a href="list.htmllist-30.html" target="_blank" title="See more replenishment/Oil control">Replenishment/Oil control</a>
<a href="list.htmllist-31.html" target="_blank" title="See more skin care packages">Skin care suit</a>
</dd>
</dl>
</div>
</li>
<li cat_id="470" class="even" >
<div class="class">
<span class="ico"><img src="images/category-pic-470.png"></span>
<h4><a href="list.htmllist-3.html">Makeup fragrance</a></h4>
<span class="recommend-class">
<a href="list.htmllist-33.html" target="_blank" title="Check more foundation fluids/Powder">Liquid Foundation/Powder</a>
<a href="list.htmllist-36.html" target="_blank" title="See more isolation/Concealer">quarantine/Concealer</a>
<a href="list.htmllist-37.html" target="_blank" title="See more eyebrows/eyelash">Eyebrow/eyelash</a>
</span><span class="arrow"></span> </div>
<div class="sub-class" cat_menu_id="470">
<dl>
<dd class="goods-class">
<a href="list.htmllist-33.html" target="_blank" title="Check more foundation fluids/Powder">Liquid Foundation/Powder</a>
<a href="list.htmllist-36.html" target="_blank" title="See more isolation/Concealer">quarantine/Concealer</a>
<a href="list.htmllist-37.html" target="_blank" title="See more eyebrows/eyelash">Eyebrow/eyelash</a>
<a href="list.htmllist-38.html" target="_blank" title="See more makeup sets">Makeup suit</a>
<a href="list.htmllist-39.html" target="_blank" title="View more Eyeliner/Eye shadow">Eyeliner/Eye shadow</a>
<a href="list.htmllist-41.html" target="_blank" title="See more lip gloss/Lipstick">Lip Gloss/Lipstick</a>
<a href="list.htmllist-42.html" target="_blank" title="Check more blush/Nail Polish">Blush/Nail Polish</a>
</dd>
</dl>
</div>
</li>
</div>
</body>
</html>
4, A complete set of web front-end introduction to advanced (Video + source code + materials + interview) (Tutorial)
A complete set of web front-end zero foundation - Introduction to advanced (Video + source code + development software + learning materials + interview questions) (Tutorial)
Suitable for entry-level to advanced children's shoes ~ send 1000 sets of HTML+CSS+JavaScript template websites
5, Source code acquisition
❉ ~ pay attention to me and praise the blog ~ bring you up knowledge every day!
❉1. See here, with the support of [praise + praise + collection] three companies, your "praise, praise and collection" is the driving force of my creation.
❉ 2. Pay attention to me ~ take you to learn every day: various front-end plug-ins, 3D cool effects, picture display, text effects, whole station templates, college students' Graduation HTML templates, final homework templates, etc! "There are many front-end developers here to discuss front-end Node knowledge and learn from each other"!
❉3. You can learn from each other about the above content and technology. You can wx public Z -- > Web front-end diary to get more source code!
6, More HTML final assignments (finished product download)
>>>Poke me > > > Click to enter 200 final assignments
The source code of more than 200 HTML5 final assessment assignments includes individuals, food, companies, schools, tourism, e-commerce, pets, electrical appliances, tea, home, hotels, dance, animation, stars, clothing, sports, cosmetics, logistics, environmental protection, books, wedding dress, military, games, festivals, smoking cessation, movies, photography, culture, hometown, flowers Gifts, cars and others can meet the web design needs of College Students' Web homework. You can download what you like!
