学生网站模板棕色蛋糕甜品网站设计——棕色蛋糕甜品店(4页) 美食甜品网页制作期末大作业成品_生鲜水果网页设计期末作业

最新推荐文章于 2024-05-13 19:05:24 发布

优质内容贡献

最新推荐文章于 2024-05-13 19:05:24 发布

阅读量537

点赞数

分类专栏： HTML5期末大作业 web大学生个人网站作业模 html网页设计作业文章标签： css 前端 html5

本文链接：https://blog.csdn.net/qq_524614081/article/details/122399527

版权

HTML5期末大作业

文章目录

HTML5期末大作业
一、作品展示
二、文件目录
三、代码实现

一、作品展示

在这里插入图片描述

二、文件目录

在这里插入图片描述

三、代码实现


<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>XXX蛋糕</title>
	<link rel="stylesheet" type="text/css" href="css/style.css">
	<link rel="stylesheet" href="css/swiper.min.css">
</head>
<body id="index">
	<div class="header">
		<div id="headerCen">
			<div id="logo"><img src="picture/logo.jpg"></div>
			<div class="headerTop">
				<div id="notice">
					<div class="notice">
					<span>2017年1月27日除夕夜，XXX蛋糕配送及400客服时间最晚至18：00，次日恢复正常服务，敬请谅解。XXX2017年1月27日除夕夜，XXX蛋糕配送及400客服时间最晚至18：00，次日恢复正常服务，敬请谅解。XXX</span>
					</div>
				</div>
				<ul id="ures">
						<li><a href="#">登录</a> <span></span></li>
						<li><a href="#">注册</a> <span></span></li>
						<li><a href="#">订单</a> <span></span></li>
						<li><img src="picture/shou_car.png"></li>
				</ul>
			</div>
			<!-- <div id="claer"></div> -->
			<ul class="headerBut">
				<li class="hover"><a href="#">首页</a></li>
				<li><a href="about.html">蛋糕家谱</a></li>
				<li><a href="tale.html">XXX物语</a></li>
				<li><a href="#">最新活动</a></li>
				<li><a href="love.html">因为爱情</a></li>
				<span><img src="picture/shou_dinahua.png"><a href="#"> XXX（服务时间：8:30-22:30）</a></span>
			</ul>
		</div>
	</div>
	<!-- header -->
	<div class="swiper-container">
		<div class="swiper-wrapper">
			<div class="swiper-slide"><img src="picture/bnner.jpg" alt=""></div>
			<div class="swiper-slide"><img src="picture/bnner.jpg" alt=""></div>
		</div>
		<div class="swiper-pagination"></div>
	</div>
	<!-- swiper -->
	<div class="content">
		<div id="content">
			<h2><img src="picture/shou_nr1.png"></h2>
			<ul class="contentMenu">
				<li>
					<img src="picture/shou_n1.jpg" class="pro">
					<div class="menuOpen">
						<div class="menu_l">
							<p>6寸/227RMB</p>
							<span>甜度:</span>
							<img src="picture/tian_du.png"