“This is the fourth day of my participation in the Gwen Challenge in November. Check out the details: The Last Gwen Challenge in 2021.”
🍅 Author’s home page: Java Li Yangyong
🍅 Home page Contact 🍅 to obtain the source code
Near the end of the semester, are you still writing an HTML web design class assignment and the teacher’s homework requirements are overwhelming? Is the total number of pages required too high? Don’t know how to do your HTML web homework? Don’t have the right template? And so on. The problem you’re trying to solve, There are personal, food, company, sports, cosmetics, logistics, environmental protection, books, wedding, military, games, festivals, smoking cessation, film, photography school, tourism, e-commerce, pets, electrical appliances, tea, home, hotel, dance, animation, stars, Clothing, culture, hometown, flowers, gifts, cars, other web design topics, A+ level homework, can meet college students web design needs can meet your needs. Original HTML+CSS+JS page design, Web college students web design homework source code, this is a good e-sports blog web page production, screen smart, very suitable for beginners to learn to use.
Video demonstration at Station B:Web Front-end final Assignment – Responsive wedding company web design. Mp4
Screenshot of webpage implementation:
homepage
Company Profile:
Company advantages:
Wedding venue:
Customer Cases:
Album List:
Service Team:
Popular events:
Project organization structure:
Main source code display:
index.html
<! DOCTYPEhtml>
<html>
<head>
<title>Html+ CSS +javaScript responsive wedding layout company web design</title>
</head>
<body>
<div class="nav_div">
<div class="container">
<a href="index.html" class="logo"><img src="images/logo.pngalt="" /></a>
<nav class="nav">
<ul class="ul1">
<li class="li1"><a href="about.html">About us</a>
<ul>
<li><a href="about.html">Company profile</a></li>
<li><a href="about_ys.html">The company advantage</a></li>
<li><a href="about_wh.html">The enterprise culture</a></li>
<li><a href="contact.html">Contact us</a></li>
</ul>
</li>
<li class="li2"><a href="hunyan.html">Wedding venue</a>
<ul>
<li><a href="hunyan.html">Minhang store</a></li>
<li><a href="hunyan.html">Putuo shop</a></li>
<li><a href="hunyan.html">Changning shops</a></li>
<li><a href="hunyan.html">Hongkou shop</a></li>
<li><a href="hunyan.html">Jing 'an store</a></li>
<li><a href="hunyan.html">Xuhui store</a></li>
</ul>
</li>
<li class="li3"><a href="case.html">Customer case</a>
<ul>
<li><a href="case.html">The lawn wedding</a></li>
<li><a href="case.html">Theme wedding</a></li>
<li><a href="case.html">Western-style wedding</a></li>
<li><a href="case.html">Chinese wedding</a></li>
<li><a href="case.html">Creative wedding</a></li>
<li><a href="case.html">A romantic wedding</a> </li>
</ul>
</li>
<li class="li4"><a href="fuwu.html">Service team</a>
<ul>
<li><a href="fuwu.html">planner</a></li>
<li><a href="fuwu.html">Wedding emcee</a></li>
<li><a href="fuwu.html">A makeup artist</a></li>
<li><a href="fuwu.html">The photographer</a></li>
</ul>
</li>
<li class="li5"><a href="news.html">Popular activities</a>
<ul>
<li><a href="news.html">Popular discount</a></li>
<li><a href="news.html">Limited-time deals</a></li>
<li><a href="news.html">Hot news</a> </li>
</ul>
</li>
</ul>
</nav>
<a href="#mmenu" class="phone-nav"><i class="fa fa-list"></i></a>
</div>
<div class="clear"></div>
</div>
</header>
<! --banner start-->
<section class="banner">
<div><a href="index.html"><img src="images/banner1.png" alt=""></a></div>
<div><a href="index.html"><img src="images/banner1.png" alt=""></a></div>
<div><a href="index.html"><img src="images/banner1.png" alt=""></a></div>
</section>
<section class="banner_x">
<div><a href="index.html"><img src="images/banner_x1.png" alt=""></a></div>
<div><a href="index.html"><img src="images/banner_x1.png" alt=""></a></div>
<div><a href="index.html"><img src="images/banner_x1.png" alt=""></a>
</div>
</body>
</html>
Copy the codestyle.css
* {
transition: All 0.2 s ease-in-out;
-webkit-transition: All 0.2 s ease-in-out;
-moz-transition: All 0.2 s ease-in-out;
-o-transition: All 0.2 s ease-in-out;
}
.left {
float: left;
}
.right {
float: right;
}
.clearfix {
overflow: hidden;
_zoom: 1;
}
.clear {
height: 0px;
clear: both;
}
body {
font-family: Microsoft Yahei;
min-width: 320px;
margin: 0px;
padding: 0px;
background: #fff;
overflow-x: hidden;
}
ul {
padding: 0px;
margin: 0px;
}
ul li {
list-style: none;
}
/*-header-*/
.phone-nav {
position: absolute;
font-size: 24px;
display: none;
color: # 000;
right: 15px;
margin-top: 28px;
font-size: 30px;
z-index: 9;
}
.phone-nav:hover {
color: # 000;
}
Copy the codeWorks from the network collection, infringement stand delete
Get the full source code:
Everyone likes, favorites, follows, comments, check the home page to get
Clocked articles updated 93/100 days