用HTML+CSS+JS做一个漂亮简单的公司网站（JavaScript期末大作业）

文章目录

一、‍网站题目
二、✍️网站描述
三、网站介绍
四、网站演示
五、⚙️ 网站代码

HTML结构代码
CSS样式代码
六、如何让学习不再盲目

七、更多干货

❤ 【作者主页——获取更多优质源码】

❤ 【学习资料/简历模板/面试资料/ 网站设计与制作】

❤ 【web前端期末大作业——毕设项目精品实战案例】

一、‍网站题目

公司官网网站、企业官网、酒店官网、等网站的设计与制作。

二、✍️网站描述

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

一套优质的网页设计应该包含 (具体可根据个人要求而定)

页面分为页头、菜单导航栏（最好可下拉）、中间内容板块、页脚四大部分。
所有页面相互超链接，可到三级页面，有5-10个页面组成。
页面样式风格统一布局显示正常，不错乱，使用Div+Css技术。
菜单美观、醒目，二级菜单可正常弹出与跳转。
要有JS特效，如定时切换和手动切换图片轮播。
页面中有多媒体元素，如gif、视频、音乐，表单技术的使用。
页面清爽、美观、大方，不雷同。。
不仅要能够把用户要求的内容呈现出来，还要满足布局良好、界面美观、配色优雅、表现形式多样等要求。

三、网站介绍

网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。

网站程序方面：计划采用最新的网页编程语言HTML5+CSS3+JS程序语言完成网站的功能设计。并确保网站代码兼容目前市面上所有的主流浏览器，已达到打开后就能即时看到网站的效果。

网站素材方面：计划收集各大平台好看的图片素材，并精挑细选适合网页风格的图片，然后使用PS做出适合网页尺寸的图片。

网站文件方面：网站系统文件种类包含：html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件；

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

其中：

（1）html文件包含：其中index.html是首页、其他html为二级页面；

（2） css文件包含：css全部页面样式,文字滚动, 图片放大等；

（3） js文件包含：js实现动态轮播特效, 表单提交, 点击事件等等（个别网页中运用到js代码）。

四、网站演示

五、⚙️ 网站代码

HTML结构代码

重庆汉沙科技有限公司 html,body{margin:0;padding:0;} .iw_poi_title {color:#CC5522;font-size:14px;font-weight:bold;overflow:hidden;padding-right:13px;white-space:nowrap} .iw_poi_content {font:12px arial,sans-serif;overflow:visible;padding-top:4px;white-space:-moz-pre-wrap;word-wrap:break-word}

023-88127143

400-0305-023

首页
公司简介
产品中心
- 全息成像
- 数字沙盘
- 创新展示
- VR虚拟现实
- AR/MR
- 3d Mapping
新闻中心
- 公司新闻
- 行业新闻
数字展馆
- 企业馆
- 城市规划馆
- 文博馆
- 主题馆
- 地产展馆
- 数字展馆
云展厅
联系我们

COMPANY PROFILE 公司简介汉沙科技

汉沙科技，数字科技赋能展览展示行业擎领者。
作为国家高新技术企业，汉沙科技拥有展览展示资质等业内相关资质，已取得超100项国家专利及软件著作权的认证。技术涵盖数字沙盘、全息展示、裸眼3D沉浸式投影、AR、VR、MR、AI、3D Mapping、影视动画、大数据、物联网、云计算等多个领域。
汉沙科技以独特的数字创意多媒体展示手段，将创意策划、设计理念、多媒体制作、系统集成、工程施工、后期运维等进行整合，为客户提供整体的创新视觉解决方案。

查看详情 PRODUCT CENTER 产品中心

全息成像
全息成像系统是一种将三维影像悬浮于空中的无屏成像技术，不需要观看者佩戴任何偏光眼镜，在完全没有束缚下，就可以尽情观看3D立体悬浮影像。
查看更多 >
数字沙盘
全息幻像沙盘，采用全息成像技术，将三维沙盘影像在空中立体悬浮呈现，影像清晰、色彩饱和度高，打破传统沙盘的局限性。
查看更多 >
创意展示
创意展示，通过高清LED或投影设备打造的数字穿越体验项目，细腻的画面结合多媒体影像，用艺术化的手法展现变化，营造出多种沉浸式视觉体验。
查看更多 >

查看更多 NEWS COMPANGY 公司动态

公司新闻更多>

汉沙科技助力中国移动六盘水分公司打造5G展厅

2018年，整个VR产业以行业应用为核心，逐渐渗透到各个领域中。现在一股来自传统领域的力量——5G，正推动着VR行业飞速发展。这次中国移动六盘水分公司展厅项目，让我们提前感受VR+5G的魅力。

行业新闻更多>

房地产新型销售武器2018-08-15
5G如何助力VR的未来发展2017-12-12
重庆将大力发展人工智能产业2017-11-28
你子女未来的生活：与AI为友VR为为师2017-08-03
3D虚拟党使馆近日上线2017-05-23

DIGITAL PAVILION 数字展馆

企业馆
城市规划馆
文博馆
主题馆
地产展馆
数字展会

移动5G智能展厅

川东集团企业展厅
电科院数字展馆
中国测绘企业展馆
中国电建集团企业展馆

城市规划馆

临港集团科创绿洲数字展厅
四川智能制造产业园
西部物流园
巫山江东新区规划馆

西昌邛海湿地宣传中心

茅台镇展示
重庆建川博物馆
雅安职业技术学院校史馆
贵州农业科学研究院

交通大数据示范基地

遵义中级人民法院
宽阔水国家自然保护区宣教馆
麻江县状元府主题馆
雅安宝兴红军翻越夹金山纪念馆

华宇地产数字售楼处

万达广场数字售楼部
恒大照母山数字售楼部
江湾城数字楼书
恒大望江华府数字售楼

中国电建集团上海展会

重庆智博会
西部旅游产业博览会
福博达投资集团
华商展会AR熊猫

公司地址：重庆市渝中区上清寺路2号太平洋广场A座3楼
业务咨询：023-88127143（24小时在线服务）
客服服务热线：400-0305-023
投诉举报热线：19922905494

首页
公司简介
产品中心
新闻中心
数字展馆
云展厅
联系我们

服务热线

023-88127143
400-0305-023

陕西汉沙科技有限公司
湖北汉沙科技有限公司
湖北汉沙科技有限公司
贵州汉沙科技有限公司

CSS样式代码

ul,li,ol{    list-style: none;}img{    border:none;}a{    color:inherit;    text-decoration:none;}a:hover{    color:inherit;    text-decoration:none;    cursor: pointer;}.clears{    clear: both;    height: 0;    overflow: hidden;    line-height: 0;    font-size: 0;}body{    font-family: Arial,Verdana,"Microsoft Yahei","Pingfang SC","Simsun";    font-size: 14px;    color: #333;}.f_left{    float:left;}.f_right{    float:right;}.f_clear{    clear:both;}/*头部*/header{    width: 1200px;    height: 81px;    overflow:hidden;}.logo{    width: 190px;    height: 45px;    background: url("../image/logo.png") no-repeat;    margin-top: 18px;    margin-left: 26px;}.phone{    width: 174px;    height: 45px;position:relative;margin-top:-45px;margin-right:20px;}.phone_icon{width:20px;height:20px;background:url(../image/phone.png);position:absolute;top:25%;}.phone>p{color:#ab1313;font-weight:bold;font-size:20px;}/*导航*/.nav{    width: 100%;    height: 60px;    background: #22538e;    font-size: 18px;    position:relative;    z-index:9999;}.section{    width: 1200px;    margin-left: auto;    margin-right: auto;}