HTML静态网页成品作业(HTML+CSS)——图书出版社介绍设计制作(6个页面)

最新推荐文章于 2024-04-16 23:12:00 发布

崽子爱码

最新推荐文章于 2024-04-16 23:12:00 发布

阅读量631

点赞数 6

分类专栏：静态网页 html网页设计与制作学生HTML个人网页作业作品文章标签： html css 前端

本文链接：https://blog.csdn.net/weixin_42283461/article/details/136496420

版权

html网页设计与制作同时被 3 个专栏收录

118 篇文章 21 订阅

订阅专栏

静态网页

115 篇文章 0 订阅

订阅专栏

学生HTML个人网页作业作品

30 篇文章 0 订阅

订阅专栏

🎉不定期分享源码，关注不丢失哦

一、作品介绍

🏷️本套采用HTML+CSS，未使用Javacsript代码，共有6个页面。
🏷️想要获取本文源码，点击前往吧

二、作品演示

在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码


<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="./css/style.css">
	</head>
	<body>
		<div class="header">
			<div class="logo">
				<a href="index.html">
					<img src="./images/logo.png" alt="">
				</a>
			</div>
		</div>
		
		<div class="nav">
			<ul>
				<li class="on"><a href="index.html">首页</a></li>
				<li><a href="tushu.html">图书中心</a></li>
				<li><a href="tushu_info.html">热门图书</a></li>
				<li><a href="xinwen.html">新闻动态</a></li>
				<li><a href="xiazai.html">下载专区</a></li>
				<li><a href="liuyan.html">反馈留言</a></li>
			</ul>
		</div>
		<div class="main">
			<div class="main_topimg">
				<img src="./images/banner.jpeg" alt="">
			</div>
			
			<div class="xs">
				<div >
					<div class="main_tit">
						<div>
							<img src="./images/xs_icon.png" alt="">
							<span>最新图书</span>
						</div>
					</div>
					<div class="xs_list">
						<div class="xs_one">
							<a href="">
								<div class="xs_img">
									<img src="./images/s1.png" alt="">
								</div>
								<div class="xs_name">
									辉煌之路
								</div>
							</a>
						</div>
						<div class="xs_one">
							<a href="">
								<div class="xs_img">
									<img src="./images/s2.jpeg" alt="">
								</div>
								<div class="xs_name">
									越过内心那座山
								</div>
							</a>
						</div>
						<div class="xs_one">
							<a href="">
								<div class="xs_img">
									<img src="./images/s3.png" alt="">
								</div>
								<div class="xs_name">
									百年庆典
								</div>
							</a>
						</div>
						<div class="xs_one">
							<a href="">
								<div class="xs_img">
									<img src="./images/s4.png" alt="">
								</div>
								<div class="xs_name">
									零容忍
								</div>
							</a>
						</div>
						<div class="xs_one">
							<a href="">
								<div class="xs_img">
									<img src="./images/s5.jpeg" alt="">
								</div>
								<div class="xs_name">
									土地制度与中国发展
								</div>
							</a>
						</div>
						<div class="xs_one">
							<a href="">
								<div class="xs_img">
									<img src="./images/s6.jpeg" alt="">
								</div>
								<div class="xs_name">
									县乡中国
								</div>
							</a>
						</div>
						<div class="xs_one">
							<a href="">
								<div class="xs_img">
									<img src="./images/s7.jpeg" alt="">
								</div>
								<div class="xs_name">
									实业强国
								</div>
							</a>
						</div>
						<div class="xs_one">
							<a href="">
								<div class="xs_img">
									<img src="./images/s8.jpeg" alt="">
								</div>
								<div class="xs_name">
									伯克毕生发展心理学
								</div>
							</a>
						</div>
						<div class="xs_one">
							<a href="">
								<div class="xs_img">
									<img src="./images/s9.jpeg" alt="">
								</div>
								<div class="xs_name">
									影响美国历史的商业七巨头
								</div>
							</a>
						</div>
						<div class="xs_one">
							<a href="">
								<div class="xs_img">
									<img src="./images/s10.jpeg" alt="">
								</div>
								<div class="xs_name">
									蛋糕经济学
								</div>
							</a>
						</div>
					</div>
					
				</div>
			</div>
		</div>
	
		<div class="footer">
			© 图书出版版权所有
		</div>
	</body>
</html>