[期末网页作业]-精仿华为官网10个网页(html+css+js)

news2024/9/20 1:01:49

经过漫长的期末考试季节,我成功地完成了一个华为官网的仿写项目,并且非常高兴地与大家分享。这个项目包含了10个页面,每一个页面都经过了精心的设计和努力的填充。 首先,我注重了页面的整体布局与设计。借鉴了华为官网的风格,我使用了华为的Logo,并且设置了显眼的导航链接,如产品、解决方案、新闻和支持等,以确保用户在访问页面时能够方便地浏览不同的内容。 在为页面添加样式和布局时,我注重了颜色的搭配和字体的选择,以保证页面的视觉效果和整体美感。我致力于使每个页面都能给用户带来愉悦的视觉体验,并且遵循了华为品牌的设计原则。 除了外观设计,我还注重了页面的交互性和功能性。为了提升用户体验,我使用了响应式设计,使得页面在不同的设备上都能良好地展示和操作。同时,我添加了一些动画效果和交互元素,使页面更加生动有趣。 感谢大家的支持与关注!如果您对我的项目有任何技术上的疑问或者建议,我会非常乐意提供帮助。让我们一起共同进步,不断提升自己的技术水平吧!谢谢!

首页包含功能:

轮播图:在首页顶部设置一个可自动轮播的图片展示区域,展示多张宣传图片或产品图片,提升页面的视觉效果和吸引力。

置顶导航:在页面的顶部设置一个固定位置的导航栏,在用户滚动页面时保持导航栏始终可见,方便用户快速浏览和访问网站其他页面。

二级菜单:在导航栏中添加下拉菜单或弹出菜单,实现二级菜单的功能。当用户悬停或点击主菜单时,显示与之相关的子菜单,使用户能够更方便地找到所需的信息或页面。

鼠标滑过文字变色:为首页的一些关键文字或链接添加鼠标滑过效果,可以改变文字颜色或背景色,以提升用户体验和页面的交互性。

图片变大:在首页适当位置设置一些图片展示区域,当用户将鼠标悬停在图片上时,图片可以呈现放大效果,以吸引用户的注意力和提供更好的视觉体验。

滚动动画:通过使用CSS或JavaScript实现滚动动画效果,例如页面滚动时元素的渐变、移动或缩放效果,为页面增添动态感和流畅度

等多种功能

作品展示

[期末网页作业]-精仿华为官网10个网页(html+css+

文档目录

 

获取源码

1,复制该网站   https://download.csdn.net/download/qq_42431718/88001914

2,点击上方下载 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/729918.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Unity3d-UGUI实现的贪食蛇小游戏

按鼠标WASD键来控制蛇的走向。 核心的代码如下: using UnityEngine; using System.Collections; using System.Collections.Generic; using UnityEngine.UI;/// 《UGUI贪吃蛇》public class TCS2d : MonoBehaviour {public bool isOver false;public bool isStop…

【Docker 部署Minio】

Docker 部署Minio 一、拉取Minio镜像二、配置1、创建如下目录2、创建容器并运行 三、访问 一、拉取Minio镜像 访问Docker Hub镜像站找到自己需要的Minio镜像 运行以下命令 sudo docker pull minio/minio二、配置 1、创建如下目录 mkdir -p /home/zx/minio/config mkdir -p…

Java设计模式之一:建造者模式

目录 一、什么是建造者模式 二、建造者模式如何使用 三、建造者模式的优势和应用场景 一、什么是建造者模式 Java建造者模式是一种创建对象的设计模式,它通过将对象的构造过程分离出来,使得同样的构建过程可以创建不同的表示。建造者模式适用于创建复…

在前端页面正确展示后端返回的验证码图片

前言: 在开发登录界面时,通过接口请求验证码;后端给返回的格式是Blob,直接用src引用没办法显示。 在控制台输入结果是: 第一想法就是通过 window.URL.createObjectURL(new Blob([res.data],{type:image/png}))转换成u…

【底部消息红点提示】uniapp开发小程序时,使用uni.setTabBarBadge设置底部菜单的红点

一、实现的效果 功能描述:无论点击底部的哪个菜单栏,都可以看到第二个菜单栏下显示的红点通知。 如果只在人脉当前页面设置的话,当你在第二个菜单栏的页面中调用uni.setTabBarBadge方法设置红点后,切换到第一个菜单栏的页面时&am…

力扣 332. 重新安排行程

题目来源:https://leetcode.cn/problems/reconstruct-itinerary/description/ C题解(来源代码随想录): 这道题目有几个难点: 一个行程中,如果航班处理不好容易变成一个圈,成为死循环。解决&am…

【论文基本功】【LaTeX】附录【IEEE论文】

注意:本博客使用的所有命令都需要以使用 IEEEtran 文档类为前提,即 tex 文件的第一行中的必须是 \documentclass[可选参数]{IEEEtran}(可选参数部分可以自由选择,如 \documentclass[10pt,journal,compsoc]{IEEEtran}。&#xff09…

C++primer(第五版)第十三章(拷贝控制)

一个类通过定义五种特殊的成员函数来控制这些操作: 拷贝构造函数 拷贝赋值运算符 移动构造函数 移动赋值运算符 析构函数 13.1拷贝,赋值与销毁 13.1.1拷贝构造函数 如果一个构造函数的第一个参数是自身类型的引用(必须是引用类型!),并且没有其他参数或是其他参数都有默认值(即…

基于matlab检测使用校准的立体摄像头拍摄的视频中的人物并确定其与摄像头的距离(附源码)

一、前言 此示例演示如何检测使用校准的立体摄像头拍摄的视频中的人物,并确定他们与摄像头的距离。 二、加载立体摄像机的参数 加载对象,这是使用应用程序或函数校准相机的结果。 三、创建视频文件阅读器和视频播放器 创建用于读取和显示视频的系统对…

LabVIEW开发X射线图像增强

LabVIEW开发X射线图像增强 X射线图像在临床诊断中起着重要作用。但是,由于各种原因,例如不均匀,低照度条件和一些噪点,图像质量通常不是很好。因此有必要增强这些图像,以方便后续处理或诊断。模糊集论是开发图像处理中…

C# Color的名称对应该工具

工具效果如下图: 代码: namespace WinFormsColor {public partial class Form1 : Form{public Form1(){InitializeComponent();}private void displayColor(){Control listControl this.Controls["listView_Color"];if (listControl ! null)…

mysql的一些练习题

1. 第1题 mysql> create database Market charset utf8; Query OK, 1 row affected (0.01 sec)第二题 mysql> use Market Database changed mysql> mysql> create table customers(-> c_num int(11) primary key auto_increment,-> c_name varchar(50),-&…

【自动化测试】

一、自动化测试定义 首先来说一下什么是软件测试? 软件测试简单来说就是在规定的条件下对程序进行操作以发现程序错误,衡量软件质量,并对其是否能满足设计要求进行评估的过程。 那么什么是自动化测试呢? 自动化测试是把以人为驱动的测试…

使用Jxbrowser7替换浏览器请求内容和header

前几天一个伙计让我帮他做jxbrowser的请求内容(requestBody,Header)的替换,特此记录。 通过官网文档查阅,我们可以通过BeforeSendUploadDataCallback和BeforeStartTransactionCallback来实现body和header的替换

MySQL之DQL(涵盖所有查询!!!)

文章目录 前言一、基础查询1.1 语法1.2 实例 二、条件查询2.1 语法2.2 条件查询实例2.3 模糊查询实例 三 、排序查询3.1 语法3.2 实例 四 、聚合函数4.1 概念4.2 聚合函数分类4.3 聚合函数语法4.4 实例 五、分组查询5.1 语法5.2 实例 六、分页查询6.1 语法6.2 实例 前言 在上一…

Docker 是什么,在 Ubuntu 虚拟机上安装(部署)Docker

本文目录 1. Docker 简介1.1 什么是 Docker1.2 Docker 与虚拟技术的区别和联系1.3 为什么要用 Docker 2. 几个基本概念2.1 镜像2.1.1 分层存储 2.2 容器2.3 仓库2.3.1 Docker Registry 公开服务2.3.2 私有 Docker Registry 3. Docker 安装3.1 卸载旧版本 Docker3.2 更新及安装工…

Visual Studio 2017下的C++开发环境搭建

Visual Studio 是Microsoft旗下的开发工具包系列产品,是一个基本完整的开发工具集,它包括整个软件生命周期中所需要的大部分工具,如UML工具、代码管控工具、集成开发环境(IDE)等等,是最流行的Windows平台应用程序的集成开发环境。…

动态规划之63 不同路径 II(第5道)

题目: 一个机器人位于一个 m x n 网格的左上角 (起始点在下图中标记为 “Start” )。 机器人每次只能向下或者向右移动一步。机器人试图达到网格的右下角(在下图中标记为 “Finish”)。 现在考虑网格中有障碍物。那…

ROS-Moveit和Gazebo联合仿真

文章目录 URDF功能包配置configlaunchCMakeLists.txtpackage.xmlurdf文件 Moveit功能包配置configlaunch 运行 URDF功能包配置 config 首先在SW2URDF生成的功能包下Config目录下新建文件joint_trajectory_controller.yaml robot_arm_controller:type: "position_contro…

Tomcat使用数据库连接池数据库

1.连接池技术的作用 数据池允许应用程序重复使用一个现有的数据库连接,而不是重新建立一个。这项技术能明显地提高对数据库操作的性能。 2.什么是连接池技术 数据库连接池在初始化时将创建一定数量的数据库连接,具体数量的由连接池的最小数据库连接数来设…