HTML静态网页成品作业(HTML+CSS)——花主题介绍网页设计制作(1个页面)

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

文章目录


一、作品介绍

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

二、作品演示

三、代码目录

四、网站代码

HTML部分代码

c 复制代码
<div class="box">
		<div class="header">
			<div class="header1">
				<img src="./img/logo_top.png">
				<ul>
					<li class="first"><a href="">首页</a></li>
					<li><a href="">发现</a></li>
					<li><a href="">图片</a></li>
					<li><a href="">分类</a></li>
				</ul>
			</div>
		</div>



		<div class="bb2">
			<div class="bb2_1">花中之王</div>
			<div class="bb2_main">
				<div class="bb2_left">
					<img src="./img/b1.jpeg">
				</div>
				<div class="bb2_hh">
					<div class="bb2_hhh">牡丹</div>
					<div class="bb2_con">牡丹(学名:Paeonia × suffruticosa Andr.)是毛茛科、芍药属植物。花色泽艳丽,玉笑珠香,风流潇洒,富丽堂皇,素有"花中之王"的美誉。在栽培类型中,主要根据花的颜色,可分成上百个品种。牡丹品种繁多,色泽亦多,以黄、绿、肉红、深红、银红为上品,尤其黄、绿为贵。牡丹花大而香,故又有"国色天香"之称。</div>
				</div>
			</div>
		</div>
		<div class="bb3">
			<div class="bb3_1">牡丹</div>
			<div class="bb3_main">
				<img src="./img/f1.jpeg">
				<img src="./img/f2.jpeg">
				<img src="./img/f3.jpeg">
				<img src="./img/f4.jpeg">
			</div>
		</div>
		<div class="bb4">
			<div class="bb4_1">花语</div>
			<div class="bb4_main">
				<div class="bb4_21">
					<div class="bb4_21_1">荷花</div>
					<div class="bb4_21_con">
						清白、高尚而谦虚(高风亮节),"出淤泥而不染,濯清涟而不妖"(周敦颐《爱莲说》),表示坚贞、纯洁、无邪、清正的品质。低调中显现出了高雅。荷花是花中品德高尚的花。
					</div>
				</div>
				<div class="bb4_21">
					<div class="bb4_21_1">兰花</div>
					<div class="bb4_21_con">
						兰花的花语是高贵、典雅、美好、贤良、清高、淡泊。自古以来兰花就象征着淡泊名利、清高典雅,兰花还代表了兄弟情深和爱国的情感,是高尚的代名词。
					</div>
				</div>
				<div class="bb4_21">
					<div class="bb4_21_1">梅花</div>
					<div class="bb4_21_con">
						梅花的花语是凌霜斗雪,迎春开放,坚强、高雅、风骨俊傲、不趋荣利。 象征的意义 梅花象征着高洁、坚强、美丽,有傲骨之风、不畏严寒、贫寒却有德行的人。
					</div>
				</div>
				<div class="bb4_21">
					<div class="bb4_21_1">菊花</div>
					<div class="bb4_21_con">
						菊花的花语是悲痛哀悼、淡泊名利、高洁雅致。菊花有悲痛哀悼的意思,常用于悼念逝去的朋友或亲人,例如在葬礼或扫墓时就多用菊花;菊花有淡泊名利的意思。
					</div>
				</div>
			</div>
		</div>

五、源码获取

🥇 ~ 关注我,点赞博文~ 每天带你涨知识!

🎁1.看到这里了就[点赞+好评+收藏]三连 支持下吧,你的「点赞,好评,收藏」是我创作的动力。

💙2.想要获取本文源码,点击前往吧

相关推荐
雪隐6 分钟前
个人电脑玩AI-13让5060 Ti给你打工——我用 0.9B 小模型终结了"谁来记会议纪要"这个世纪难题
前端·人工智能·后端
橘子星9 分钟前
我一个前端切图仔,凭什么能在浏览器里跑大模型?
前端·javascript·前端框架
70asunflower14 分钟前
初学者理解 Web 工作原理(完全教程)
前端
爱勇宝17 分钟前
《道德经》第 7 章:真正厉害的领导者,不抢主角
前端·后端·程序员
观远数据18 分钟前
Excel到数据资产池:文件数据入湖的治理规范怎么建
前端·javascript·excel
CoderWeen20 分钟前
我写了个能一步步点着看的 Dijkstra 可视化项目(Vue3 + Leaflet + Generator)
前端·javascript·vue.js
两点王爷41 分钟前
一个快速加载面和多面数据的html测试页面(可以导出geojson数据文件)
前端·html·gis
热爱前端的小张42 分钟前
第四章 接口和类型兼容性
前端
hunterandroid44 分钟前
[鸿蒙从零到一] HarmonyOS 资源管理与多语言适配实战
前端
用户69371750013841 小时前
Claude Code终端日志Token占用实测:一个过滤器砍掉60%-90%
android·前端·后端