html期末设计作业——品牌红酒销售网页模板(4页) html网页设计期末大作业_网页设计平时作业

最新推荐文章于 2023-11-13 09:49:32 发布

优质内容贡献

最新推荐文章于 2023-11-13 09:49:32 发布

阅读量534

点赞数

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

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

版权

这是一份HTML5期末大作业，展示了品牌红酒销售的网页设计，包含4页内容，支持手机和PC的响应式布局。作品涵盖Div+CSS、鼠标特效、导航栏、表单等元素，提供完整源码供学习和下载。

摘要由CSDN通过智能技术生成

HTML5期末大作业：红酒销售网页网站设计——品牌红酒销售网页模板(4页) html网页设计期末大作业_网页设计平时作业

作品介绍

1.网页作品简介 ：HTML期末大学生网页设计作业 A+水平 ,喜欢的可以下载，文章页支持手机PC响应式布局。

2.网页作品编辑：作品下载后可使用任意HTML编辑软件（如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML软件编辑修改网页）。

3.网页作品技术：Div+CSS、鼠标滑过特效、Table、导航栏效果、banner、表单、二级三级页面等，视频、音频元素、Flash，同时设计了logo（源文件），基本期末作业所需的知识点全覆盖。

文章目录

HTML5期末大作业：红酒销售网页网站设计——品牌红酒销售网页模板(4页) html网页设计期末大作业_网页设计平时作业
作品介绍
一、作品展示
二、文件目录
三、代码实现
四、获取更多源码
五、学习资料
六、更多源码

一、作品展示

在这里插入图片描述

二、文件目录

在这里插入图片描述

三、代码实现



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>首页</title>
<link href="css/index.css" rel="stylesheet" type="text/css" />
</head>

<body bgcolor="#F4F4F4">
<div id="login">
<h2>欢迎！</h2>
<div id="loginp"><a href="login.html">登录</a>|<a href="#">注册</a>|<a href="#">联系我们</a></div>
</div>
<div id="logoall">
<div id="logo">
    <div id="logo1">
    <a href="index.html">
    <img src="image/logo.png" width="200" height="100" />
    </a>
    </div>
    <div id="search">
    <input type="text" id="search_txt" placeholder="请输入" />
    <input type="submit" id="ss" value="搜索" />
    </div>
   <div id="logo2"><img src="image/logoright.png" width="100" height="25" /></div></div></div>
<div id="naviall">
<div id="navi">
    <ul>
         <li><div class="shouye"><a href="index.html">首页</a></div></li>
         <li><a href="About.html">关于</a></li>
         <li><a href="show.html">产品展示</a></li>
         <li><a href="#">服务</a></li>
         <li><a href="#">专题</a></li>
         <li><a href="#">看点</a></li>
    </ul>
</div>
</div>
<div class="wrap">
    	<div class="banner" style="background:#fbf8f3">
        	<div class="banner_img">
            	<img src="image/banner1.jpg" width="1200"  />
            </div>
        </div>
        <div class="banner" style="background:#f0f0f0">
        	<div class="banner_img">
            	<img src="image/banner2.jpg" width="1200"  />
            </div>
        </div>
        <div class="banner" style="background:#f7ead7">
        	<div class="banner_img">
            	<img src="image/banner3.jpg" width="1200" />
            </div>
        </div>
        <div class="banner" style="background:#f1e6ea">
        	<div class="banner_img">
            	<img src="image/banner4.jpg" width="1200"  />
            </div>
        </div>
        <div class="banner" style="background:#f7ead7">
        	<div class="banner_img">
            	<img src="image/banner5.jpg" width="1200