🍅 Author home page: Li Yangyong
🍅 Introduction: high quality creator in Java field 🏆, [Li Yangyong] author of public account ✌ Resume template, learning materials, interview question bank, technical assistance [pay attention to me and give it to you]
🍅 Get the source code at the end of the article 🍅
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? The total number of pages required is too much? Can't you start HTML web page homework? No suitable template? And so on. You want to solve the problem in the column 👇🏻👇🏻👇🏻👇🏻
java project boutique actual combat sharing case "100 sets"
Web final assignment web page practice "100 sets"
Html+Css+JS final assignment "100 sets"
Common web design topics include individuals, food, companies, sports, cosmetics, logistics, environmental protection, books, wedding dress, military, games, festivals, smoking cessation, movies, photography schools, tourism, e-commerce, pets, electrical appliances, tea, home, hotels, dance, animation, stars, clothing Culture, hometown, flowers, gifts, cars, other web design topics, A + level homework can meet the needs of College Students' web design. Original HTML+CSS+JS page design, web college students' web design homework source code, this is A good E-sports blog web page production, the picture is smart, very suitable for beginners to learn and use.
Video demonstration of station B: Web front end final assignment course -- responsive car rental web design.mp4
Screenshot of web page implementation: get the source code contact at the end of the article
Website home page
Interior design, as a new subject, although it is only in recent decades, people consciously arrange and decorate the interior of their own life and production activities, even beautify the decoration and endow the interior ring
Personal tweets and comments:
comment
Comments:
album:
Album list:
About me:
Project organization structure:
Main source code display:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title>Responsive cool personal log blog web design</title>
<link rel="stylesheet" type="text/css" href="../res/layui/css/layui.css">
<link rel="stylesheet" type="text/css" href="../res/css/main.css">
<!--load meta IE Compatible file-->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
</head>
<body>
</script>
</div>
<div class="header">
<div class="menu-btn">
<div class="menu"></div>
</div>
<h1 class="logo">
<a href="index.html">
<span>MYBLOG</span>
<img src="../res/img/logo.png">
</a>
</h1>
<div class="nav">
<a href="index.html" class="active">article</a>
<a href="whisper.html">Micro language</a>
<a href="leacots.html">Leaving a message.</a>
<a href="album.html">album</a>
<a href="about.html">about</a>
</div>
<ul class="layui-nav header-down-nav">
<li class="layui-nav-item"><a href="index.html" class="active">article</a></li>
<li class="layui-nav-item"><a href="whisper.html">Micro language</a></li>
<li class="layui-nav-item"><a href="leacots.html">Leaving a message.</a></li>
<li class="layui-nav-item"><a href="album.html">album</a></li>
<li class="layui-nav-item"><a href="about.html">about</a></li>
</ul>
<p class="welcome-text">
Welcome to<span class="name">Xiao Ming</span>Blog~
</p>
</div>
<div class="banner">
<div class="cont w1000">
<div class="title">
<h3>MY<br />BLOG</h3>
<h4>well-balanced heart</h4>
</div>
<div class="amount">
<p><span class="text">Visits</span><span class="access">1000</span></p>
<p><span class="text">journal</span><span class="daily-record">1000</span></p>
</div>
</div>
</div>
<div class="tlinks">Collect from <a href="http://Www.cssmoban. COM / "> Web page template < / a > < / div >
<div class="content">
<div class="cont w1000">
<div class="title">
<span class="layui-breadcrumb" lay-separator="|">
<a href="javascript:;" class="active">Design article</a>
<a href="javascript:;">Front end article</a>
<a href="javascript:;">Travel notes</a>
</span>
</div>
<div class="list-item">
<div class="item">
<div class="layui-fluid">
<div class="layui-row">
<div class="layui-col-xs12 layui-col-sm4 layui-col-md5">
<div class="img"><img src="../res/img/sy_img1.jpg" alt=""></div>
</div>
<div class="layui-col-xs12 layui-col-sm8 layui-col-md7">
<div class="item-cont">
<h3>The three-dimensional effect drawing of the space perfectly presents the final effect<button class="layui-btn layui-btn-danger new-icon">new</button></h3>
<h5>Design article</h5>
<p>As an emerging discipline, interior design has existed since the beginning of human civilization, although it has only been in recent decades, people consciously arrange and decorate the interior of their own life and production activities, even beautify and decorate, and endow the indoor environment with the desired atmosphere</p>
<a href="details.html" class="go-icon"></a>
</div>
</div>
</div>
</div>
</div>
<div class="item">
<div class="layui-fluid">
<div class="layui-row">
<div class="layui-col-xs12 layui-col-sm4 layui-col-md5">
<div class="img"><img src="../res/img/sy_img2.jpg" alt=""></div>
</div>
<div class="layui-col-xs12 layui-col-sm8 layui-col-md7">
<div class="item-cont">
<h3>The three-dimensional effect drawing of the space perfectly presents the final effect<button class="layui-btn layui-btn-danger new-icon">new</button></h3>
<h5>Design article</h5>
<p>As an emerging discipline, interior design has existed since the beginning of human civilization, although it has only been in recent decades, people consciously arrange and decorate the interior of their own life and production activities, even beautify and decorate, and endow the indoor environment with the desired atmosphere</p>
<a href="details.html" class="go-icon"></a>
</div>
</div>
</div>
</div>
</div>
<div class="item">
<div class="layui-fluid">
<div class="layui-row">
<div class="layui-col-xs12 layui-col-sm4 layui-col-md5">
<div class="img"><img src="../res/img/sy_img3.jpg" alt=""></div>
</div>
<div class="layui-col-xs12 layui-col-sm8 layui-col-md7">
<div class="item-cont">
<h3>The three-dimensional effect drawing of the space perfectly presents the final effect<button class="layui-btn layui-btn-danger new-icon">new</button></h3>
<h5>Design article</h5>
<p>As an emerging discipline, interior design has existed since the beginning of human civilization, although it has only been in recent decades, people consciously arrange and decorate the interior of their own life and production activities, even beautify and decorate, and endow the indoor environment with the desired atmosphere</p>
<a href="details.html" class="go-icon"></a>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="../res/layui/layui.js"></script>
<script type="text/javascript">
layui.config({
base: '../res/js/util/'
}).use(['element', 'laypage', 'jquery', 'menu'], function() {
element = layui.element, laypage = layui.laypage, $ = layui.$, menu = layui.menu;
laypage.render({
elem: 'demo',
count: 70 //Total data, obtained from the server
});
menu.init();
})
</script>
</body>
</html>style.css
.w1000 {
max-width: 1000px !important;
margin: 0 auto;
}
.header {
height: 120px;
line-height: 120px;
position: relative;
font-size: 16px;
}
.header .logo,
.header .welcome-text,
.header .nav {
position: absolute;
top: 0;
}
.header .logo {
left: 65px;
}
.header .logo span {
display: none;
}
.header .nav {
left: 250px;
}The works come from network collection, infringement, legislation and deletion
Get the complete source code:
Everyone likes, collects, pays attention to, comments and views below 👇🏻👇🏻👇🏻 WeChat official account 👇🏻👇🏻👇🏻
Punch in article update 82/ 100 days
Recommended reading:
100 sets of high-quality practical case of Java completion project