HTML+CSS鲜花网页制作 DW静态网页设计个人网页制作

最新推荐文章于 2025-03-14 13:16:47 发布

原创

最新推荐文章于 2025-03-14 13:16:47 发布 · 3.8k 阅读

97 ·

CC 4.0 BY-SA版权

文章标签：

#html #css #前端

本教程介绍了一个使用HTML+CSS制作的鲜花主题个人网页，涉及Div+CSS、鼠标效果、导航栏、表单及多媒体元素的应用，并提供代码展示。

一、作品介绍

网页作品代码简单html+css，可使用任意HTML编辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作）。

技术方面主要应用了学生网页课程中的: Div+CSS、鼠标滑过特效、Table、导航栏效果、Banner、表单、二级三级页面等，视频、音频元素、Flash，同时设计了Logo（源文件）所需的知识点。

二、作品演示

在这里插入图片描述

三、代码展示

代码说明：以下仅展示部分代码供参考~

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>子悦花店</title>
		<link rel="stylesheet" type="text/css" href="css/common.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
	</head>
	<body>
		<div class="box">
			<div class="header">
				<ul>
					<li class="title">子悦花店</li>
					<li>当季新品</li>
					<li>全部宝贝</li>
					<li>鲜花礼盒</li>
					<li>花语大全</li>
					<li>配送服务</li>
				</ul>
			</div>
			<div