某科技有限公司网站设计与实现（html）

小鱼儿 2024-03-31 14:38 79阅读 0赞

目 录  
摘 要 I  
Abstract II  
目 录 IV  
第1章 绪论 1  
1.1 选题背景及意义 1  
1.2郑州爱拓科技有限公司现状 1  
1.3研究主要内容 3  
第2章 郑州爱拓科技有限公司网站开发相关技术及工具 4  
2.1 Dreamweaver简介 4  
2.2 HTML语言简介 5  
2.4 Photoshop简介 7  
第3章 网站整体设计 9  
3.1需求分析 9  
3.2网站功能结构图 9  
3.3前台功能模块设计 10  
第4章 网站各项功能的实现及效果分析 12  
4.1网站功能的实现 12  
4.2前后台效果分析 29  
第五章 总结 33  
参考文献 35  
致 谢 36  
1.3研究主要内容  
1、信息管理模块  
是将新闻、信息栏目和业界动态等信息集中起来发布、管理等为一体的网站应用程序，无论管理员身处何地，只要能够上网就能对网站信息进行更新及维护，支持无限极分类。  
2、信息展示模块  
是将管理员给整理，发布的信息，在网页显示，访问者可对信息的种类及关键字进行查询  
3、产品展示模块  
展示商品的基本信息，方便用户购买和筛选  
4、商品管理模块  
管理员将商品录入到商品数据库  
5、人才招聘  
发布招聘信息，方便求职者应聘  
6、解决方案  
结合公司产品为用户提供解决方案，案列展示等  
9、联系我们  
公布公司联系方式  
第2章 郑州爱拓科技有限公司网站开发相关技术及工具  
2.1 Dreamweaver简介  
Adobe Dreamweaver，简称“DW”，中文名称 “梦想编织者”，是美国MACROMEDIA郑州爱拓科技有限公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器，DW是第一套针对专  
业网页设计师特别发展的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。Macromedia郑州爱拓科技有限公司成立于1992年，2005年被Adobe郑州爱拓科技有限公司收购。Adobe Dreamweaver使用所见即所得的接口，亦有HTML（标准通用标记语言下的一个应用）编辑的功能。它有Mac和Windows系统的版本。Macromedia被Adobe收购后，Adobe也开始计划开发Linux版本的Dreamweaver了。 Dreamweaver自MX版本开始，使用了Opera的排版引擎"Presto" 作为网页预览  
Dreamweaver是一个功能强大的网页设计工具，有着方便实用的工具和所见即所得的排版功能，见面十分友好，使用方便。在不需要掌握HTML语言的情况下，即可利用其强大的功能开发出专业的网页。Dreamweaver也是一个方便的编程工具，可以方便地编写ASP、PHP、JSP代码，软件的自动提示填充功能和代码染色功能可以有效地帮助用户编写和调试各种代码。它集网页设计、网站开发和站点管理功能于一身，具有可视化、支持多平台和跨浏览器的特性，是目前网站设计、开发、制作的首选工具。借助于Dreamweaver可以快速方便地开发出各种动态或静态网站。。  
发展历程：  
Dreamweaver1.0发布于1997年12月，由之前的Macromedia郑州爱拓科技有限公司发布。  
Dreamweaver2.0，发布于1998年12月。  
Dreamweaver3.0，发布于1999年12月。  
Dreamweaver3.0不足3M，是个经典版本。无论是多破的机器，速度特快，功能够用。此时的Dreamweaver已经是一个集网页创作和站点管理两大利器于一身的超重量级的创作工具。  
功能介绍：  
借助共享型用户界面设计，在AdobeCreativeSuite4的不同组件之间更快、更明智地工作。使用工作区切换器可以从一个工作环境快速切换到下一个环境。

<!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>某某某有限公司</title>
    <meta name="keywords" content="某某某有限公司">
    <meta name="description" content="某某某有限公司">
    <link href="css/style.css"  rel="stylesheet" />
    <link href="css/index.css"  rel="stylesheet" />
    
    <script src="js/jquery-1.8.3.min.js" type="text/javascript"></script>
    <script src="js/jquery.SuperSlide.2.1.1.js" type="text/javascript"></script>
    
    
    
    </head>
    <body>
    
    <header>
    	<div class="beijing">
    		<h2><a href="index.html" ><em><img class="abc" src="img/249_src.png"></em></a></h2>
    		<ul>
    			<li>
    				<a class="menu_1 hover"  href="index.html" >首页</a>
    			</li>
    			<li>
    				<a class="menu_1 " href="guan.html" >关于我们<em></em></a>
    				<div class="menu ">
    					<div class="menu_left">
    						<a href="guan.html" >关于我们</a>
    						<a href="cheng.html" >诚聘英才</a>
    						<a href="qi.html" >企业风采</a>
    					</div>
    					<div class="menu_right">
    						
                            <dl>
    							<dt><a href="guan.html" ><img src="img/284_src.jpg" ></a></dt>
    							<dd>
    								<div class="menu_right1" style="text-indent:2em;">郑州爱拓科技有限公司，业务郑州爱拓科技有限公司、信某某某司某某某有限公郑州爱拓科技有限公司某某某限公司某有限公司成、郑州爱拓科技有限公司电脑、办公用品某某某郑州爱拓科技有限公司司系列，网络产品运郑州爱拓科技有限公司开建郑州爱拓科技有限公司”，公司车载业务覆郑州爱拓科技有限公司有限公司流某某某限公公司某某有限公司务车、驾郑州爱拓科技有限公司郑州爱拓科技有限公司公司</div>
    								<div class="menu_right2"><a href="guan.html" >查看详细</a></div>
    							</dd>
    						</dl>
                            <dl>
    							<dt><a href="cheng.html" ><img src="img/801_sr.jpg" ></a></dt>
    							<dd>
    								<div class="menu_right1"> 
    									<p> 薪——想要高薪，只要你愿意； </p>
    									<p> 满——满载的不仅是你的钱包，还有你的理想； </p>
    									<p> 益——收益金钱、学识和技能； </p>
    									<p> 足——足够的发展空间。 </p>
    								</div>
    								<div class="menu_right2"><a href="cheng.html" >查看详细</a></div>
    							</dd>
    						</dl>
                            <dl>
    							<dt><a href="qi.html" ><img src="img/8_s.jpg" ></a></dt>
    							<dt><a href="qi.html" ><img src="img/8_1s.jpg" ></a></dt>
    							<dd>
    								
    								<div class="menu_right2"><a href="qi.html" >查看详细</a></div>
    							</dd>
    						</dl>
                        </div>
                    </div>	
    			</li>
    			<li>
    				<a class="menu_1 " href="xin.html">新闻资讯<em></em></a>
    				<div class="menu ">
    					<div class="menu_right">
    						
                            <dl>
    							<dt><a href="xin.html" ><img src="img/808_src.jpg" ></a></dt>
    							<dd>
    								<div class="menu_right1">
    									<p>热烈祝贺郑州爱拓科技有限公司通过山西郑州爱拓科技有限公司态监台郑州爱拓科技有限公司</p>
    									<p>国内首郑州爱拓科技有限公司用车均配郑州爱拓科技有限公司控系统</p>
    									<p>堪称国内之郑州爱拓科技有限公司双模兼郑州爱拓科技有限公司模块进入市场</p>
    									<p>声控导郑州爱拓科技有限公司领行业前行</p>
    								</div>
    								<div class="menu_right2"><a href="xin.html" >查看详细</a></div>
    							</dd>
    						</dl>
                        </div>
                    </div>	
    			</li>
    
    			<li>
    				<a class="menu_1 " href="chan.html" >产品展示<em></em></a>
    				<div class="menu ">
    					<div class="menu_right">
    						
                            <dl>
    							<dt><a href="chan.html" ><img src="img/810_src.jpg" ></a></dt>
    							<dt><a href="chan.html" ><img src="img/810_2src.jpg" ></a></dt>
    							<dt><a href="chan.html" ><img src="img/810_1src.jpg" ></a></dt>
    							<dd>
    								<div class="menu_right1"></div>
    								<div class="menu_right2 aaa"><a href="chan.html" >更多产品</a></div>
    							</dd>
    						</dl>
                        </div>
                    </div>
    			</li>
    
    			<li>
    				<a class="menu_1 " href="ji.html" >技术支持<em></em></a>
    				<div class="menu ">
    					<div class="menu_right">
    						
                            <dl>
                                <dt><a href="ji.html" ><img src="img/2014_src.jpg" ></a></dt>
                                <dd>
                                    <div class="menu_right1" style="text-indent:2em;">车辆郑州爱拓科技有限公司郑州爱拓科技有限公司根据目前各企业单位运输管理的实际需求和特点，以营运流程管理和车辆信息郑州爱拓科技有限公司基础，融入了先进某某某有郑州爱拓科技有限公司流郑州爱拓科技有限公司卫星定郑州爱拓科技有限公司系统。系统将营运流程管理与动态信息完美结合，为用户提郑州爱拓科技有限公司郑州爱拓科技有限公司某有限公司、郑州爱拓科技有限公司、油耗管理。</div>
                                    <div class="menu_right2"><a href="ji.html">查看详细</a></div>
                                </dd>
                              </dl>
                        </div>
                    </div>	
    			</li>
    
    			<li>
    				<a class="menu_1 " href="an.html" >案例应用<em></em></a>
    				<div class="menu ">
    					<div class="menu_right">
    						
                            <dl>
    							<dt><a href="an.html" ><img src="img/832_src.jpg" ></a></dt>
    							<dt><a href="an.html" ><img src="img/832_1src.jpg" ></a></dt>
    							<dt><a href="an.html" ><img src="img/832_2src.jpg" ></a></dt>
    							<dd>
    								<div class="menu_right1"></div>
    								<div class="menu_right2"><a href="an.html" >更多案例</a></div>
    							</dd>
    						</dl>
                        </div>
                    </div>	
    			</li>
    												
    			<li>
    				<a class="menu_1 " href="lian.html" >联系我们<em></em></a>
    				<div class="menu ">
    					<div class="menu_right">
    						
                            <dl>
    							<dt><a href="lian.html" ><img src="img/810_s.jpg" ></a></dt>
    							<dd>
    								<div class="menu_right1">
    									<p>	地址：山西某某某有限郑州爱拓科技有限公司工商郑州爱拓科技有限公司层 </p>
    									<p> 电话：0356-123456 35649 </p>
    									<p> 售后服务电话：0356-123456 </p>
    									<p> 全国客户服务热线：400-000-111 </p>
    								</div>
    								<div class="menu_right2"><a href="lian.html" >查看详细</a></div>
    							</dd>
    						</dl>
                        </div>
                    </div>
    			</li>
    																																																																																																																																																																					
    		</ul>
    		<div class="clear"></div>		
    	</div>
    	<div class="clear"></div>
    </header>
    <div class="banner">
        <div class="bd">
            <ul>
                <li><a href="#" style="background:url(./img/563_src.jpg) no-repeat center 0;background-size:100% 100%;"></a></li>
                <li><a href="#" style="background:url(./img/1962_src.jpg) no-repeat center 0;background-size:100% 100%;"></a></li>
                <li><a href="#" style="background:url(./img/1059_src.jpg) no-repeat center 0;background-size:100% 100%;"></a></li>
                <li><a href="#" style="background:url(./img/2017_src.png) no-repeat center 0;background-size:100% 100%;"></a></li>
                <li><a href="#" style="background:url(./img/1154_src.jpg) no-repeat center 0;background-size:100% 100%;"></a></li>
                <li><a href="#" style="background:url(./img/408_src.jpg) no-repeat center 0;background-size:100% 100%;"></a></li>              
            </ul>
        </div>
        <div class="hd">
            <ul>
                <li class="rounded"></li>
                <li class="rounded"></li>
                <li class="rounded"></li>
                <li class="rounded"></li>
                <li class="rounded"></li>
                <li class="rounded"></li>
    
            </ul>
        </div>
    	
    </div>
    
    <ul class="beijing index1">
    	<a href="chan.html" >
    		<li class="index1_bg1" style="background: url(./img/802_src.jpg) no-repeat 0 0;">    
    		    <p><img src="img/index_1_tx.png" ></p>
    		</li>
    	</a>
    	<a href="ji.html" >
    		<li class="index1_bg2" style="background: url(./img/803_src.jpg) no-repeat 0 0;">
    		    <p><img src="img/index_2_tx.png" ></p>
    		</li>
    	</a>
    	<a href="an.html" >
    		<li class="index1_bg3" style="background: url(./img/804_src.jpg) no-repeat 0 0;">
    		    <p><img src="img/index_3_tx.png" ></p>
    		</li>
    	</a>
    	<a href="lian.html" >
    		<li class="index1_bg4" style="background: url(./img/801_src.jpg) no-repeat 0 0;">
    		    <p><img src="img/index_4_tx.png" ></p>
    		</li>
    	</a>
    </ul>
    
    <footer class="ppp">
    	<p style="font-size:13px;font-weight:bold"> Copyright 2019 郑州爱拓科技有限公司 xxx.xxx.com 版权所有 </p>
    	<p style="font-size:13px;font-weight:bold"> Address：郑州爱拓科技有限公司</p>
    </footer>
    
    </body>
    </html>
    
    <script type="text/javascript">
    jQuery(".banner").slide({
         mainCell:".bd ul",effect:"fold",autoPlay:true,interTime:5000 });
    jQuery(".index_2").slide({
         mainCell:"ul.bd.htm",effect:"topLoop",autoPlay:true,interTime:5000 });
    </script>
    <script type="text/javascript" src="js/xmsz_common.js" ></script>

![在这里插入图片描述][8fd3b27d62da4a3bb530d40b8be64315.png_pic_center]  
![在这里插入图片描述][50a49221adf84f2aa3c7b0dacd532a01.png_pic_center]  
![在这里插入图片描述][dbc391da73914a5682d069970af57f15.png_pic_center]  
![在这里插入图片描述][7d25877dc1c2443fb4ecd92c2dcedf9f.png_pic_center]  
![在这里插入图片描述][75ab31db1f474029990d7104034e8986.png_pic_center]  
![在这里插入图片描述][c5438dc1a5604640bc7697ce2fdc2ec8.png_pic_center]  
![在这里插入图片描述][8fba2ad5f81d4804b714c01bff1e6d0a.png_pic_center]  
![在这里插入图片描述][bd4e20d9fbfd42d989e47d9e09a94a5e.png_pic_center]  
![在这里插入图片描述][a19b5564a1834d8c8587da956137cd7f.png_pic_center]  
![在这里插入图片描述][3aef8a05b0584a71893674e26a00e90e.png_pic_center]  
![在这里插入图片描述][35a57080eddd4dc1a49362eb8047e156.png_pic_center]  
![在这里插入图片描述][a94216ec143740f28ba6c9bbbf196bb0.png_pic_center]  
![在这里插入图片描述][db77a81e87f8445a801b177db7b7ef7c.png_pic_center]  
![在这里插入图片描述][bd7b488be42e4cf5a9611007aefd7985.png_pic_center]  
![在这里插入图片描述][085a07c2b9994024873f9d2ff2b248c2.png_pic_center]  
![在这里插入图片描述][8a5c130e05d94477a61d78938adb396f.png_pic_center]  
![在这里插入图片描述][d3d61e84dd9d4cb68427c403002e0092.png_pic_center]

[8fd3b27d62da4a3bb530d40b8be64315.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/a59155c0ee8445308eeb0920727c69d7.png
[50a49221adf84f2aa3c7b0dacd532a01.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/266b0607e09e44ce953afea16cc477ec.png
[dbc391da73914a5682d069970af57f15.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/b4062f386a0e4be382905371fec9ee47.png
[7d25877dc1c2443fb4ecd92c2dcedf9f.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/f3fefed3a1714e87adf68bab106e3e45.png
[75ab31db1f474029990d7104034e8986.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/b9ef1135a2334fb49a5850916f144f77.png
[c5438dc1a5604640bc7697ce2fdc2ec8.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/87dd504b58184571be5016aeec42ebf1.png
[8fba2ad5f81d4804b714c01bff1e6d0a.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/0a67d4fe057146a4931bb9c339734566.png
[bd4e20d9fbfd42d989e47d9e09a94a5e.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/28cd3b56bc2447f9ad783e1cf3b6553c.png
[a19b5564a1834d8c8587da956137cd7f.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/2b0ff96d0f344ff7aca4eecb585277c4.png
[3aef8a05b0584a71893674e26a00e90e.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/0e74bb89c0e7480daec20002186e017f.png
[35a57080eddd4dc1a49362eb8047e156.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/78a9a6d3c07b4489a18cf6d34313d908.png
[a94216ec143740f28ba6c9bbbf196bb0.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/c2daaa3ca03a484dbc979d41c7a6a789.png
[db77a81e87f8445a801b177db7b7ef7c.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/e80144a7e00f42f6a2b03359dcdb0f1c.png
[bd7b488be42e4cf5a9611007aefd7985.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/7d7b2599c9f2425ba9ae2399f0710afd.png
[085a07c2b9994024873f9d2ff2b248c2.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/763c27d6ca014e3ca3ce2c02f43d8e98.png
[8a5c130e05d94477a61d78938adb396f.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/c21eee55ce1a4c0ca2516f69bca63050.png
[d3d61e84dd9d4cb68427c403002e0092.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/31/b31c7935c48742649d075e75f577ff43.png