## 一、服务简要界面设计效果图
(4)服务简要页面,服务简要界面如图所示:
![](http://h.yiniuedu.com/5867fd0df113bd7d4d9a0b531aaff3d0)
该页面整体布局分为上中下,上面为导航菜单和图片。中间为内容区,下面为页脚区,显示联系邮箱、联系地址,联系QQ,联系电话,以及联系我们,版权所有、ICP备案、资源活动、法律声明和环保方案。
中间内容区:服务简要页面有三个标签,分别是:环保工程、大气工程和水处理工程,每个标签下5张图片,要求按照一定的规则整齐排列,点击不同图片跳转到不同的案例页面。每个图片都要和标签对应一致。
服务简要页面主要展示公司所从事服务的行业案例图片展示。
环保工程
![](http://h.yiniuedu.com/ec82fb923289c0a02d25ca4ec665cb8e)
大气工程
![](http://h.yiniuedu.com/ad34a23e4e9ae403e9cb5a4b74a1a3b7)
水处理工程
![](http://h.yiniuedu.com/e7852dcc7dcb80146e0ca696d958c03b)
## 二、服务简要界面布局实现
![](http://h.yiniuedu.com/68534d8a86e95c0b1ff7989541cceb70)
![](http://h.yiniuedu.com/ac339afd3e01473093a5fdf8fb4c10d4)
## 三、页面CSS样式实现
![](http://h.yiniuedu.com/781c95df7698a752ae6450725a16a27b)
## 四、页面js文件
![](http://h.yiniuedu.com/cd6e95ed408d9cef03850222e082c14c)