1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title></title>
6
7 <!-- mobile responsive meta -->
8 <meta name="viewport" content="width=device-width, initial-scale=1">
9 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
10 <link rel="stylesheet" href="css/style.css">
11 <link rel="stylesheet" href="css/responsive.css">
12 <link rel="stylesheet" href="fonts/flaticon.css" />
13
14 <style type="text/css">
15 .outer-box{
16 display:none
17 }
18 .hand{
19 cursor:pointer
20 }
21 #nr1{
22 display:none
23 }
24 #jgsj{
25 color:green
26 }
27 </style>
28
29 </head>
30
31 <body>
32 <!-- Menu -->
33 <section class="theme_menu stricky">
34 <div class="container">
35 <div class="row">
36 <div class="col-md-5">
37 <div class="main-logo">
38 <a href="index.html"><img src="images/logo/logo.png" alt=""></a>
39 </div>
40 </div>
41 <div class="col-md-5 menu-column" style="margin-left:200px">
42 <nav class="menuzord" id="main_menu">
43 <ul class="menuzord-menu">
44 <li><a href="index.html">主页</a></li>
45 <li><a href="about.html">关于我们</a></li>
46 <li><a href="service.html">服务详情</a></li>
47 <li><a href="service-single.html">服务列表</a></li>
48 <li><a href="contact.html">联系我们</a></li>
49 </ul> <!-- End of .menuzord-menu -->
50 </nav> <!-- End of #main_menu -->
51 </div>
52 </div>
53 </div> <!-- End of .conatiner -->
54 </section> <!-- End of .theme_menu -->
55
56 <!--Page Title-->
57 <section class="page-title">
58 <div class="container">
59 <div class="row clearfix">
60 <div class="col-md-6 col-sm-6 col-xs-12 pull-left">
61 <h1>服务列表</h1>
62 <p>下面是我们服务的各项内容</p>
63 </div>
64 <div class="col-md-6 col-sm-6 col-xs-12 pull-right text-right path"><a href="index.html">主页</a> / <a href="#">服务列表</a></div>
65 <div class="overlay"></div>
66 </div>
67 </div>
68 </section>
69 <!--Page Title Ends-->
70
71 <section class="service-single">
72 <div class="container">
73 <div class="row">
74 <div class="col-md-4 col-sm-12 col-xs-12">
75 <div class="service-sidebar">
76 <ul class="service-catergory">
77 <li id="jgsj" class="hand"><span class="icon-left fa fa-chevron-right"></span>景观设计</li>
78 <li id="zs" class="hand"><span class="icon-left fa fa-chevron-right"></span>植树</li>
79 <li id="hyhl" class="hand"><span class="icon-left fa fa-chevron-right"></span>花园护理</li>
80 <li id="cpyh" class="hand" ><span class="icon-left fa fa-chevron-right"></span>草坪养护</li>
81 <li id="jghy" class="hand"><span class="icon-left fa fa-chevron-right"></span>浇灌花园</li>
82 <li id="cc" class="hand"><span class="icon-left fa fa-chevron-right"></span>除草</li>
83 </ul>
84 </div>
85 </div>
86
87
88
89 <div class="col-md-8 col-sm-12 col-xs-12">
90 <div id="nr1" class="outer-box" style="display:block">
91 <div class="img-box"><img src="images/resources/service-1.jpg" alt=""></div>
92
93
94 <div class="content-box">
95 <div class="sec-title">
96 <h4>景观设计</h4>
97 </div>
98
99 <div class="text">
100 <p>风景园林规划设计(景观设计)[1] 要素包括自然景观要素和人工景观要素。其中自然景观要素主要是指自然风景,如大小山丘、古树名木、石头、河流、湖泊、海洋等。人工景观要素主要有文物古迹、文化遗址、园林绿化、艺术小品、商贸集市、建构筑物、广场等。</p>
101 </div>
102
103 <div class="text style-two">
104 <p>这些景观要素为创造高质量的城市空间环境提供了大量的素材,但是要形成独具特色的城市景观,必须对各种景观要素进行系统组织,并且结合风水使其形成完整和谐的景观体系,有序的空间形态。</p>
105 </div>
106 <div class="row clearfix">
107 <div class="col-md-6 col-sm-6">
108 <h4>主要服务</h4>
109 <p>景观设计主要服务于:城市景观设计(城市广场、商业街、办公环境等)、居住区景观设计、城市公园规划与设计、滨水绿地规划设计、旅游度假区与风景区规划设计等。</p>
110 </div>
111 <div class="col-md-6 col-sm-6">
112 <h4>近代时期</h4>
113 <p>中国传统符号种类很多,有中国传统的吉祥物:青龙、白虎、朱雀、玄武、凤、貔貅、双鱼、蝙蝠、玉兔等;有五行的金、木、水、火、土;还有中国传统的宝相植物:牡丹、荷花、石榴、月季、松、竹、梅等。在“新中式”景观设计中采用以上传统符号用抽象或简化的手法来体现中国传统文化内涵,运用形式多种多样,可镶刻于景墙、大门、廊架、景亭、地面铺装、座凳上;或以雕塑小品的形式出现;或与灯饰相结合。</p>
114 </div>
115 </div>
116
117 </div>
118 </div>
119
120 <div id="nr2" class="outer-box">
121 <div class="img-box"><img src="images/resources/service-2.jpg" alt=""></div>
122
123
124 <div class="content-box">
125 <div class="sec-title">
126 <h4>植树</h4>
127 </div>
128
129 <div class="text">
130 <p>风景园林规划设计(景观设计)[1] 要素包括自然景观要素和人工景观要素。其中自然景观要素主要是指自然风景,如大小山丘、古树名木、石头、河流、湖泊、海洋等。人工景观要素主要有文物古迹、文化遗址、园林绿化、艺术小品、商贸集市、建构筑物、广场等。</p>
131 </div>
132
133 <div class="text style-two">
134 <p>这些景观要素为创造高质量的城市空间环境提供了大量的素材,但是要形成独具特色的城市景观,必须对各种景观要素进行系统组织,并且结合风水使其形成完整和谐的景观体系,有序的空间形态。</p>
135 </div>
136 <div class="row clearfix">
137 <div class="col-md-6 col-sm-6">
138 <h4>主要服务</h4>
139 <p>景观设计主要服务于:城市景观设计(城市广场、商业街、办公环境等)、居住区景观设计、城市公园规划与设计、滨水绿地规划设计、旅游度假区与风景区规划设计等。</p>
140 </div>
141 <div class="col-md-6 col-sm-6">
142 <h4>近代时期</h4>
143 <p>中国传统符号种类很多,有中国传统的吉祥物:青龙、白虎、朱雀、玄武、凤、貔貅、双鱼、蝙蝠、玉兔等;有五行的金、木、水、火、土;还有中国传统的宝相植物:牡丹、荷花、石榴、月季、松、竹、梅等。在“新中式”景观设计中采用以上传统符号用抽象或简化的手法来体现中国传统文化内涵,运用形式多种多样,可镶刻于景墙、大门、廊架、景亭、地面铺装、座凳上;或以雕塑小品的形式出现;或与灯饰相结合。</p>
144 </div>
145 </div>
146
147 </div>
148
149
150 </div>
151
152 <div id="nr3" class="outer-box">
153 <div class="img-box"><img src="images/resources/service-3.jpg" alt=""></div>
154
155
156 <div class="content-box">
157 <div class="sec-title">
158 <h4>花园护理</h4>
159 </div>
160
161 <div class="text">
162 <p>风景园林规划设计(景观设计)[1] 要素包括自然景观要素和人工景观要素。其中自然景观要素主要是指自然风景,如大小山丘、古树名木、石头、河流、湖泊、海洋等。人工景观要素主要有文物古迹、文化遗址、园林绿化、艺术小品、商贸集市、建构筑物、广场等。</p>
163 </div>
164
165 <div class="text style-two">
166 <p>这些景观要素为创造高质量的城市空间环境提供了大量的素材,但是要形成独具特色的城市景观,必须对各种景观要素进行系统组织,并且结合风水使其形成完整和谐的景观体系,有序的空间形态。</p>
167 </div>
168 <div class="row clearfix">
169 <div class="col-md-6 col-sm-6">
170 <h4>主要服务</h4>
171 <p>景观设计主要服务于:城市景观设计(城市广场、商业街、办公环境等)、居住区景观设计、城市公园规划与设计、滨水绿地规划设计、旅游度假区与风景区规划设计等。</p>
172 </div>
173 <div class="col-md-6 col-sm-6">
174 <h4>近代时期</h4>
175 <p>中国传统符号种类很多,有中国传统的吉祥物:青龙、白虎、朱雀、玄武、凤、貔貅、双鱼、蝙蝠、玉兔等;有五行的金、木、水、火、土;还有中国传统的宝相植物:牡丹、荷花、石榴、月季、松、竹、梅等。在“新中式”景观设计中采用以上传统符号用抽象或简化的手法来体现中国传统文化内涵,运用形式多种多样,可镶刻于景墙、大门、廊架、景亭、地面铺装、座凳上;或以雕塑小品的形式出现;或与灯饰相结合。</p>
176 </div>
177 </div>
178
179 </div>
180 </div>
181
182 <div id="nr4" class="outer-box">
183 <div class="img-box"><img src="images/resources/service-4.jpg" alt=""></div>
184
185
186 <div class="content-box">
187 <div class="sec-title">
188 <h4>草坪养护</h4>
189 </div>
190
191 <div class="text">
192 <p>风景园林规划设计(景观设计)[1] 要素包括自然景观要素和人工景观要素。其中自然景观要素主要是指自然风景,如大小山丘、古树名木、石头、河流、湖泊、海洋等。人工景观要素主要有文物古迹、文化遗址、园林绿化、艺术小品、商贸集市、建构筑物、广场等。</p>
193 </div>
194
195 <div class="text style-two">
196 <p>这些景观要素为创造高质量的城市空间环境提供了大量的素材,但是要形成独具特色的城市景观,必须对各种景观要素进行系统组织,并且结合风水使其形成完整和谐的景观体系,有序的空间形态。</p>
197 </div>
198 <div class="row clearfix">
199 <div class="col-md-6 col-sm-6">
200 <h4>主要服务</h4>
201 <p>景观设计主要服务于:城市景观设计(城市广场、商业街、办公环境等)、居住区景观设计、城市公园规划与设计、滨水绿地规划设计、旅游度假区与风景区规划设计等。</p>
202 </div>
203 <div class="col-md-6 col-sm-6">
204 <h4>近代时期</h4>
205 <p>中国传统符号种类很多,有中国传统的吉祥物:青龙、白虎、朱雀、玄武、凤、貔貅、双鱼、蝙蝠、玉兔等;有五行的金、木、水、火、土;还有中国传统的宝相植物:牡丹、荷花、石榴、月季、松、竹、梅等。在“新中式”景观设计中采用以上传统符号用抽象或简化的手法来体现中国传统文化内涵,运用形式多种多样,可镶刻于景墙、大门、廊架、景亭、地面铺装、座凳上;或以雕塑小品的形式出现;或与灯饰相结合。</p>
206 </div>
207 </div>
208
209 </div>
210 </div>
211
212 <div id="nr5" class="outer-box">
213 <div class="img-box"><img src="images/resources/service-3.jpg" alt=""></div>
214
215
216 <div class="content-box">
217 <div class="sec-title">
218 <h4>浇灌花园</h4>
219 </div>
220
221 <div class="text">
222 <p>风景园林规划设计(景观设计)[1] 要素包括自然景观要素和人工景观要素。其中自然景观要素主要是指自然风景,如大小山丘、古树名木、石头、河流、湖泊、海洋等。人工景观要素主要有文物古迹、文化遗址、园林绿化、艺术小品、商贸集市、建构筑物、广场等。</p>
223 </div>
224
225 <div class="text style-two">
226 <p>这些景观要素为创造高质量的城市空间环境提供了大量的素材,但是要形成独具特色的城市景观,必须对各种景观要素进行系统组织,并且结合风水使其形成完整和谐的景观体系,有序的空间形态。</p>
227 </div>
228 <div class="row clearfix">
229 <div class="col-md-6 col-sm-6">
230 <h4>主要服务</h4>
231 <p>景观设计主要服务于:城市景观设计(城市广场、商业街、办公环境等)、居住区景观设计、城市公园规划与设计、滨水绿地规划设计、旅游度假区与风景区规划设计等。</p>
232 </div>
233 <div class="col-md-6 col-sm-6">
234 <h4>近代时期</h4>
235 <p>中国传统符号种类很多,有中国传统的吉祥物:青龙、白虎、朱雀、玄武、凤、貔貅、双鱼、蝙蝠、玉兔等;有五行的金、木、水、火、土;还有中国传统的宝相植物:牡丹、荷花、石榴、月季、松、竹、梅等。在“新中式”景观设计中采用以上传统符号用抽象或简化的手法来体现中国传统文化内涵,运用形式多种多样,可镶刻于景墙、大门、廊架、景亭、地面铺装、座凳上;或以雕塑小品的形式出现;或与灯饰相结合。</p>
236 </div>
237 </div>
238
239 </div>
240 </div>
241
242 <div id="nr6" class="outer-box">
243 <div class="img-box"><img src="images/resources/service-2.jpg" alt=""></div>
244
245
246 <div class="content-box">
247 <div class="sec-title">
248 <h4>除草</h4>
249 </div>
250
251 <div class="text">
252 <p>风景园林规划设计(景观设计)[1] 要素包括自然景观要素和人工景观要素。其中自然景观要素主要是指自然风景,如大小山丘、古树名木、石头、河流、湖泊、海洋等。人工景观要素主要有文物古迹、文化遗址、园林绿化、艺术小品、商贸集市、建构筑物、广场等。</p>
253 </div>
254
255 <div class="text style-two">
256 <p>这些景观要素为创造高质量的城市空间环境提供了大量的素材,但是要形成独具特色的城市景观,必须对各种景观要素进行系统组织,并且结合风水使其形成完整和谐的景观体系,有序的空间形态。</p>
257 </div>
258 <div class="row clearfix">
259 <div class="col-md-6 col-sm-6">
260 <h4>主要服务</h4>
261 <p>景观设计主要服务于:城市景观设计(城市广场、商业街、办公环境等)、居住区景观设计、城市公园规划与设计、滨水绿地规划设计、旅游度假区与风景区规划设计等。</p>
262 </div>
263 <div class="col-md-6 col-sm-6">
264 <h4>近代时期</h4>
265 <p>中国传统符号种类很多,有中国传统的吉祥物:青龙、白虎、朱雀、玄武、凤、貔貅、双鱼、蝙蝠、玉兔等;有五行的金、木、水、火、土;还有中国传统的宝相植物:牡丹、荷花、石榴、月季、松、竹、梅等。在“新中式”景观设计中采用以上传统符号用抽象或简化的手法来体现中国传统文化内涵,运用形式多种多样,可镶刻于景墙、大门、廊架、景亭、地面铺装、座凳上;或以雕塑小品的形式出现;或与灯饰相结合。</p>
266 </div>
267 </div>
268
269 </div>
270 </div>
271 </div>
272 </div>
273 </div>
274 </section>
275
276
277
278
279 <!--call-to-action section-->
280 <section class="call-to-action subscribe-intro">
281 <div class="container">
282 <div class="row">
283 <div class="col-md-9">
284 <h3>及早联系园艺师</h3>
285 <p>园艺师会给你一些最好的意见和建议</p>
286 </div>
287 <div class="col-md-3">
288 <a href="contact.html" class="thm-btn inverse pull-right">联系我们</a>
289 </div>
290 </div>
291 </div>
292 </section>
293
294 <footer class="footer bg-style" style="background-image:url(images/background/bg-3.jpg);">
295 <div class="container">
296 <div class="footer-upper">
297
298 <div class="row">
299 <div class="col-md-3 col-sm-6">
300 <div class="footer-widget about-widget">
301 <a href="#">
302 <img src="images/logo/logo2.png" alt="Awesome Image" />
303 </a>
304 <p>园艺师这个职业,应证了一句老话:“越老越值钱。”初级园艺师,月薪不过千元左右,而高级园艺师月收入都在万元以上。经验老道的园艺师,能熟悉植物生长规律及习性,熟知土壤、气候等因素与植物生长的关系,这些都不是书本上的理论知识可以迅速补充的,需要长时间实践的检验。
305 </p>
306 <div class="link_btn">
307 <a href="contact.html" style="color:#0F0">联系我们</a>
308 </div>
309 </div>
310 </div>
311 <div class="col-md-2 col-sm-6">
312 <div class="footer-widget quick-links">
313 <h3 class="title">我们的服务</h3>
314 <ul>
315 <li><p>除雪</p></li>
316 <li><p>浇灌花园</p></li>
317 <li><p>设计草坪</p></li>
318 <li><p>景观美化</p></li>
319 <li><p>园林种植</p></li>
320 </ul>
321 </div>
322 </div>
323 <div class="col-md-3 col-sm-6">
324 <div class="footer-widget opening-hour">
325 <h3 class="title">开放时间</h3>
326 <p>下面是我们的开放时间</p>
327
328 <ul class="day-time">
329 <li><span>周一-周六 :</span> <span>08.00 - 17.00 </span></li>
330 <li><span>周日 :</span> <span>09.00 - 15.00</span></li>
331 <li><span>周五 :</span> <span>休息</span></li>
332 </ul>
333 </div>
334 </div>
335 <div class="col-md-4 col-sm-6">
336 <div class="footer-widget contact-widget">
337 <h3 class="title">留言</h3>
338 <div class="default-form-area">
339 <form id="contact-form" name="contact_form" class="default-form" action="inc/sendmail.php" method="post">
340 <div class="row-10 clearfix">
341 <div class="column col-md-6 col-sm-6 col-xs-12">
342 <div class="form-group">
343 <input type="text" name="form_name" class="form-control" value="" placeholder="姓名" required>
344 </div>
345 </div>
346
347 <div class="column col-md-6 col-sm-6 col-xs-12">
348 <div class="form-group">
349 <input type="text" name="form_phone" class="form-control" value="" placeholder="电话">
350 </div>
351 </div>
352
353 <div class="column col-md-12 col-sm-12 col-xs-12">
354 <div class="form-group">
355 <textarea name="form_message" class="form-control textarea required" placeholder="信息"></textarea>
356 </div>
357 </div>
358 <div class="column col-md-12 col-sm-12 col-xs-12">
359 <div class="form-group">
360 <input id="form_botcheck" name="form_botcheck" class="form-control" type="hidden" value="">
361 <button class="thm-btn thm-color" type="submit" data-loading-text="Please wait...">联系我们</button>
362 </div>
363 </div>
364
365 </div>
366 </form>
367 </div>
368 </div>
369 </div>
370 </div>
371 </div>
372 <!--Footer Bottom-->
373 <div class="footer-bottom">
374 <div class="pull-left"><div class="copyright-text" style="margin-left:400px;">Copyright © 2017.Company name All rights reserved.
375 </div>
376 </div>
377 </div>
378 </div>
379 </footer>
380
381
382
383 <!-- Scroll Top Button -->
384 <button class="scroll-top tran3s color2_bg">
385 <span class="fa fa-angle-up"></span>
386 </button>
387 <!-- pre loader -->
388 <div class="preloader"></div>
389
390 <!-- jQuery js -->
391 <script src="js/jquery.js"></script>
392 <!-- bootstrap js -->
393 <script src="js/bootstrap.min.js"></script>
394 <!-- jQuery ui js -->
395 <script src="js/jquery-ui.js"></script>
396 <!-- owl carousel js -->
397 <script src="js/owl.carousel.min.js"></script>
398 <!-- jQuery validation -->
399 <script src="js/jquery.validate.min.js"></script>
400 <!-- google map -->
401 <script src="http://ditu.google.cn/maps/api/js?key=AIzaSyCRvBPo3-t31YFk588DpMYS6EqKf-oGBSI"></script>
402 <script src="js/gmap.js"></script>
403 <!-- mixit up -->
404 <script src="js/wow.js"></script>
405 <script src="js/jquery.mixitup.min.js"></script>
406 <script src="js/jquery.fitvids.js"></script>
407 <script src="js/bootstrap-select.min.js"></script>
408 <script src="js/menuzord.js"></script>
409
410 <!-- revolution slider js -->
411 <script src="assets/revolution/js/jquery.themepunch.tools.min.js"></script>
412 <script src="assets/revolution/js/jquery.themepunch.revolution.min.js"></script>
413 <script src="assets/revolution/js/extensions/revolution.extension.actions.min.js"></script>
414 <script src="assets/revolution/js/extensions/revolution.extension.carousel.min.js"></script>
415 <script src="assets/revolution/js/extensions/revolution.extension.kenburn.min.js"></script>
416 <script src="assets/revolution/js/extensions/revolution.extension.layeranimation.min.js"></script>
417 <script src="assets/revolution/js/extensions/revolution.extension.migration.min.js"></script>
418 <script src="assets/revolution/js/extensions/revolution.extension.navigation.min.js"></script>
419 <script src="assets/revolution/js/extensions/revolution.extension.parallax.min.js"></script>
420 <script src="assets/revolution/js/extensions/revolution.extension.slideanims.min.js"></script>
421 <script src="assets/revolution/js/extensions/revolution.extension.video.min.js"></script>
422
423 <!-- fancy box -->
424 <script src="js/jquery.fancybox.pack.js"></script>
425 <script src="js/jquery.polyglot.language.switcher.js"></script>
426 <script src="js/nouislider.js"></script>
427 <script src="js/jquery.bootstrap-touchspin.js"></script>
428 <script src="js/SmoothScroll.js"></script>
429 <script src="js/jquery.appear.js"></script>
430 <script src="js/jquery.countTo.js"></script>
431 <script src="js/jquery.flexslider.js"></script>
432 <script src="js/imagezoom.js"></script>
433 <script src="js/validation.js"></script>
434 <script id="map-script" src="js/default-map.js"></script>
435 <script src="js/custom.js"></script>
436
437 </div>
438
439 </body>
440 </html>
441 <script type="text/javascript">
442 document.getElementById("jgsj").onclick = function(){
443 document.getElementById("nr1").style.display="block";
444 document.getElementById("nr2").style.display="none";
445 document.getElementById("nr3").style.display="none";
446 document.getElementById("nr4").style.display="none";
447 document.getElementById("nr5").style.display="none";
448 document.getElementById("nr6").style.display="none";
449 document.getElementById("jgsj").style.color="green";
450 document.getElementById("zs").style.color="black";
451 document.getElementById("hyhl").style.color="black";
452 document.getElementById("cpyh").style.color="black";
453 document.getElementById("jghy").style.color="black";
454 document.getElementById("cc").style.color="black";
455 }
456
457 document.getElementById("zs").onclick = function(){
458 document.getElementById("nr2").style.display="block";
459 document.getElementById("nr1").style.display="none";
460 document.getElementById("nr3").style.display="none";
461 document.getElementById("nr4").style.display="none";
462 document.getElementById("nr5").style.display="none";
463 document.getElementById("nr6").style.display="none";
464 document.getElementById("jgsj").style.color="black";
465 document.getElementById("zs").style.color="green";
466 document.getElementById("hyhl").style.color="black";
467 document.getElementById("cpyh").style.color="black";
468 document.getElementById("jghy").style.color="black";
469 document.getElementById("cc").style.color="black";
470 }
471
472 document.getElementById("hyhl").onclick = function(){
473 document.getElementById("nr3").style.display="block";
474 document.getElementById("nr2").style.display="none";
475 document.getElementById("nr1").style.display="none";
476 document.getElementById("nr4").style.display="none";
477 document.getElementById("nr5").style.display="none";
478 document.getElementById("nr6").style.display="none";
479 document.getElementById("jgsj").style.color="black";
480 document.getElementById("zs").style.color="black";
481 document.getElementById("hyhl").style.color="green";
482 document.getElementById("cpyh").style.color="black";
483 document.getElementById("jghy").style.color="black";
484 document.getElementById("cc").style.color="black";
485 }
486
487 document.getElementById("cpyh").onclick = function(){
488 document.getElementById("nr4").style.display="block";
489 document.getElementById("nr2").style.display="none";
490 document.getElementById("nr3").style.display="none";
491 document.getElementById("nr1").style.display="none";
492 document.getElementById("nr5").style.display="none";
493 document.getElementById("nr6").style.display="none";
494 document.getElementById("jgsj").style.color="black";
495 document.getElementById("zs").style.color="black";
496 document.getElementById("hyhl").style.color="black";
497 document.getElementById("cpyh").style.color="green";
498 document.getElementById("jghy").style.color="black";
499 document.getElementById("cc").style.color="black";
500 }
501
502 document.getElementById("jghy").onclick = function(){
503 document.getElementById("nr5").style.display="block";
504 document.getElementById("nr2").style.display="none";
505 document.getElementById("nr3").style.display="none";
506 document.getElementById("nr4").style.display="none";
507 document.getElementById("nr1").style.display="none";
508 document.getElementById("nr6").style.display="none";
509 document.getElementById("jgsj").style.color="black";
510 document.getElementById("zs").style.color="black";
511 document.getElementById("hyhl").style.color="black";
512 document.getElementById("cpyh").style.color="black";
513 document.getElementById("jghy").style.color="green";
514 document.getElementById("cc").style.color="black";
515
516 }
517
518 document.getElementById("cc").onclick = function(){
519 document.getElementById("nr6").style.display="block";
520 document.getElementById("nr2").style.display="none";
521 document.getElementById("nr3").style.display="none";
522 document.getElementById("nr4").style.display="none";
523 document.getElementById("nr5").style.display="none";
524 document.getElementById("nr1").style.display="none";
525 document.getElementById("jgsj").style.color="black";
526 document.getElementById("zs").style.color="black";
527 document.getElementById("hyhl").style.color="black";
528 document.getElementById("cpyh").style.color="black";
529 document.getElementById("jghy").style.color="black";
530 document.getElementById("cc").style.color="green";
531
532 }
533
534
535
536 </script>
537
538
539 <!--document.getElementById("EleId").style.display="none";
540 document.getElementById("EleId").style.display="inline";
541 -->
1 441 <script type="text/javascript">
2 442 document.getElementById("jgsj").onclick = function(){
3 443 document.getElementById("nr1").style.display="block";
4 444 document.getElementById("nr2").style.display="none";
5 445 document.getElementById("nr3").style.display="none";
6 446 document.getElementById("nr4").style.display="none";
7 447 document.getElementById("nr5").style.display="none";
8 448 document.getElementById("nr6").style.display="none";
9 449 document.getElementById("jgsj").style.color="green";
10 450 document.getElementById("zs").style.color="black";
11 451 document.getElementById("hyhl").style.color="black";
12 452 document.getElementById("cpyh").style.color="black";
13 453 document.getElementById("jghy").style.color="black";
14 454 document.getElementById("cc").style.color="black";
15 455 }
16 456
17 457 document.getElementById("zs").onclick = function(){
18 458 document.getElementById("nr2").style.display="block";
19 459 document.getElementById("nr1").style.display="none";
20 460 document.getElementById("nr3").style.display="none";
21 461 document.getElementById("nr4").style.display="none";
22 462 document.getElementById("nr5").style.display="none";
23 463 document.getElementById("nr6").style.display="none";
24 464 document.getElementById("jgsj").style.color="black";
25 465 document.getElementById("zs").style.color="green";
26 466 document.getElementById("hyhl").style.color="black";
27 467 document.getElementById("cpyh").style.color="black";
28 468 document.getElementById("jghy").style.color="black";
29 469 document.getElementById("cc").style.color="black";
30 470 }
31 471
32 472 document.getElementById("hyhl").onclick = function(){
33 473 document.getElementById("nr3").style.display="block";
34 474 document.getElementById("nr2").style.display="none";
35 475 document.getElementById("nr1").style.display="none";
36 476 document.getElementById("nr4").style.display="none";
37 477 document.getElementById("nr5").style.display="none";
38 478 document.getElementById("nr6").style.display="none";
39 479 document.getElementById("jgsj").style.color="black";
40 480 document.getElementById("zs").style.color="black";
41 481 document.getElementById("hyhl").style.color="green";
42 482 document.getElementById("cpyh").style.color="black";
43 483 document.getElementById("jghy").style.color="black";
44 484 document.getElementById("cc").style.color="black";
45 485 }
46 486
47 487 document.getElementById("cpyh").onclick = function(){
48 488 document.getElementById("nr4").style.display="block";
49 489 document.getElementById("nr2").style.display="none";
50 490 document.getElementById("nr3").style.display="none";
51 491 document.getElementById("nr1").style.display="none";
52 492 document.getElementById("nr5").style.display="none";
53 493 document.getElementById("nr6").style.display="none";
54 494 document.getElementById("jgsj").style.color="black";
55 495 document.getElementById("zs").style.color="black";
56 496 document.getElementById("hyhl").style.color="black";
57 497 document.getElementById("cpyh").style.color="green";
58 498 document.getElementById("jghy").style.color="black";
59 499 document.getElementById("cc").style.color="black";
60 500 }
61 501
62 502 document.getElementById("jghy").onclick = function(){
63 503 document.getElementById("nr5").style.display="block";
64 504 document.getElementById("nr2").style.display="none";
65 505 document.getElementById("nr3").style.display="none";
66 506 document.getElementById("nr4").style.display="none";
67 507 document.getElementById("nr1").style.display="none";
68 508 document.getElementById("nr6").style.display="none";
69 509 document.getElementById("jgsj").style.color="black";
70 510 document.getElementById("zs").style.color="black";
71 511 document.getElementById("hyhl").style.color="black";
72 512 document.getElementById("cpyh").style.color="black";
73 513 document.getElementById("jghy").style.color="green";
74 514 document.getElementById("cc").style.color="black";
75 515
76 516 }
77 517
78 518 document.getElementById("cc").onclick = function(){
79 519 document.getElementById("nr6").style.display="block";
80 520 document.getElementById("nr2").style.display="none";
81 521 document.getElementById("nr3").style.display="none";
82 522 document.getElementById("nr4").style.display="none";
83 523 document.getElementById("nr5").style.display="none";
84 524 document.getElementById("nr1").style.display="none";
85 525 document.getElementById("jgsj").style.color="black";
86 526 document.getElementById("zs").style.color="black";
87 527 document.getElementById("hyhl").style.color="black";
88 528 document.getElementById("cpyh").style.color="black";
89 529 document.getElementById("jghy").style.color="black";
90 530 document.getElementById("cc").style.color="green";
91 531
92 532 }
93 533
94 534
95 535
96 536 </script>
![](https://images2015.cnblogs.com/blog/1083644/201704/1083644-20170418181059602-896066132.jpg)
![](https://images2015.cnblogs.com/blog/1083644/201704/1083644-20170418181128165-1303951163.jpg)