HTML静态网页成品作业(HTML+CSS)——西点蛋糕介绍(5个页面)

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


一、作品介绍

🏷️本套采用HTML+CSS,未使用Javacsript代码,共有5个页面

二、作品演示

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

三、代码目录

在这里插入图片描述

四、网站代码

HTML部分代码


<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<link rel="stylesheet" type="text/css" href="./css/style.css">
</head>
<body>



	<div class="main">
		
		<div class="logo">
			<a href="index.html"><img src="./images/logo.png"></a>
		</div>
		<div class="nav">
			<ul>
				<li class="on"><a href="index.html">首页</a></li>
				<li><a href="jianjie.html">西点简介</a></li>
				<li><a href="fenlei.html">西点分类</a></li>
				<li><a href="zhanshi.html">西点展示</a></li>
				<li><a href="zuofa.html">西点做法</a></li>
			</ul>
		</div>

		<div class="banner">
			<img src="./images/banner.jpeg">
		</div>
		<div class="whitebg">
			<div class="type">
				<h3>SWEETY SWEET</h3>
				<div class="type_list">
					<div class="type_item">
						<img src="./images/1.png">
						<div>提拉米苏</div>
					</div>
					<div class="type_item">
						<img src="./images/2.png">
						<div>布丁</div>
					</div>
					<div class="type_item">
						<img src="./images/3.png">
						<div>芝士蛋糕</div>
					</div>
					<div class="type_item">
						<img src="./images/4.png">
						<div>泡芙</div>
					</div>
					<div class="type_item">
						<img src="./images/5.png">
						<div>马卡龙</div>
					</div>
				</div>
			</div>

			<div class="desc">
				<div class="desc_text">
					西式的甜品花团锦簇,尤以意、法为盛。提拉米苏(Tiramisu)和萨芭雍(Sabayon)这种华丽的甜点一出场,餐桌就变成了春装发布会的天桥。
				</div>

			</div>
			<div class="img_list">
				<img src="./images/i1.jpg">
				<img src="./images/i2.jpg">
				<img src="./images/i3.jpg">
			</div>
		</div>
		<div class="footer">
			<div>
				<img src="./images/logo.png">
			</div>
			<div class="footer_text">
				据说品尝一块自己钟爱甜品的幸福感相当于得到心仪汉子的十个熊抱~现在马上就到了春暖花开季节,春季旅游也被许多妹子提上了行程,<br>
某甜品站推荐超级有特色甜品咖啡屋,想一想如果来一个甜品之旅是多么幸福,快到甜品店体验甜蜜如初恋的滋味吧~放松心情的时候到了,你还在等什么呢?
			</div>
		</div>
	</div>
</body>
</html>

五、源码获取

🥇 ~ 关注我,点赞博文~ 每天带你涨知识!
🎁1.看到这里了就[点赞+好评+收藏]三连 支持下吧,你的「点赞,好评,收藏」是我创作的动力。
💙2.想要获取本文源码,点击前往吧

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-03-18 11:46:04       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-03-18 11:46:04       100 阅读
  3. 在Django里面运行非项目文件

    2024-03-18 11:46:04       82 阅读
  4. Python语言-面向对象

    2024-03-18 11:46:04       91 阅读

热门阅读

  1. 前端小白的学习之路(事件流)

    2024-03-18 11:46:04       35 阅读
  2. 2024/03/16----面试中遇到的一些面试题

    2024-03-18 11:46:04       40 阅读
  3. 【Python】Flask上下文管理

    2024-03-18 11:46:04       43 阅读
  4. sparksql的SQL风格编程

    2024-03-18 11:46:04       43 阅读
  5. ES6:可迭代对象(Iterable object)

    2024-03-18 11:46:04       42 阅读
  6. SQL server 构建索引的demo

    2024-03-18 11:46:04       38 阅读
  7. ES6 数组常用方法

    2024-03-18 11:46:04       42 阅读
  8. 【Vue2源码】响应式原理

    2024-03-18 11:46:04       41 阅读
  9. HBase常用命令

    2024-03-18 11:46:04       36 阅读
  10. 安装vscode及插件

    2024-03-18 11:46:04       44 阅读
  11. SpringBoot整合ElasticSearch应用

    2024-03-18 11:46:04       35 阅读
  12. CSS学习

    2024-03-18 11:46:04       40 阅读