1 <!doctype html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Document</title>
6 <link rel="stylesheet" href="css/reset.css">
7 <link rel="stylesheet" href="css/head.css">
8 <link rel="stylesheet" href="css/dasaizixun.css">
9 <link rel="stylesheet" href="css/education.css">
10 <link rel="stylesheet" href="css/grow.css">
11 <link rel="stylesheet" href="css/advantage.css">
12 <link rel="stylesheet" href="css/bottom.css">
13 <style>
14
15 </style>
16 </head>
17 <body>
18 <!-- 头部开始 -->
19 <div class="head">
20 <div class="headTop"><!-- 头部上 -->
21 <p class="welcome">欢迎您登陆中国艺术人才创新教育研究会!</p>
22 <p class="telephone">400-888-8888</p>
23 <p class="email">hr@inet198.com</p>
24 </div>
25 <div class="headChaQu"></div>
26 <div class="headMiddle"><!-- 头部中 -->
27 <img src="images/z_zhuoyi.png" alt="" class="headZhuoYi">
28 <div class="headMiddleFirst">
29 首页
30 </div>
31 <div class="headIntroduce">
32 大赛介绍
33 <ul class="er_headIntroduce">
34 <li class="er_headIntroduce_org">组织机构</li>
35 <li>支持单位</li>
36 <li>专家阵容</li>
37 <li>支持媒体</li>
38 <li>联系我们</li>
39 </ul>
40 </div>
41 <div class="headTeacher">
42 名师名校
43 <div class="er_headTeacher">
44 <ul class="san_headTeacher">
45 <li class="er_headTeacher_fine">优秀教师</li>
46 <li>名校风采</li>
47 <li>教学心得</li>
48 </ul>
49 <ul class="san_headPrize">
50 <li>奖项设置</li>
51 <li>参赛须知</li>
52 </ul>
53 </div>
54 </div>
55 <div class="headBoutique">
56 精品欣赏
57 </div>
58 <div class="headAchieve">
59 成绩查询
60 <ul class="er_headAchieve">
61 <li class="er_headAchieve_query">成绩查询</li>
62 <li>下载海报</li>
63 <li>下载报名表</li>
64 <li>下载参赛表</li>
65 <li>下载电子书</li>
66 </ul>
67 </div>
68 </div>
69 <div class="headBottom"><!-- 头部下 -->
70 </div>
71 </div>
72 <!-- 头部结束 -->
73 <!-- 中间主体部分开始 -->
74 <div class="con">
75 <div class="conFirst"><!-- 大赛咨询 -->
76 <div class="conFirst_left">
77 <img src="images/z_aggregate.jpg" alt="">
78 <div class="conFirst_leftBg"></div>
79 <p class="conFirst_leftTxet">198网络科技公司总经理李星燎与IDG资本合伙创始人熊晓鹤先生合影</p>
80 <div class="conFirst_leftTurnl">
81 <img src="images/z_left.png" alt="向左">
82 </div>
83 <div class="conFirst_leftTurnr">
84 <img src="images/z_right.png" alt="向右">
85 </div>
86 </div>
87 <div class="conFirst_right">
88 <div class="conFirst_rightTop">
89 <img src="images/z_c.png" alt="c"class="conFirst_rightTopPic">
90 <ul class="conFirst_rightTopPicWords">
91 <li class="match">大赛咨询</li>
92 <li class="contest">contest information</li>
93 </ul>
94 </div>
95 <p class="conFirst_rightMiddle">
96 美好世界，我们共同沐浴阳光；在欢笑中，我们挥洒内心的喜悦；要用画笔，绘出心中的美好；魔术帽里，都是我们奇思妙想的创意；我们要用手中的笔，写出对未来的憧憬，画出未来美好的侧才，随着各地的文化差异，国际文化的大融合，我们的教育观念也逐步与时俱进，为推动素质教育改革进程，实现青少年没事的国际化交流，更好的展示青少年儿童积极向上、追求美好生活的时代精神，进一步提高青少年的美学素养和审美能力、首届卓艺青少年书画艺术精品展将面向全国青少年儿童征集书法、绘画、摄影、剪纸、泥塑、逃陶艺、沙画、手工艺品的佳作。
97 </p>
98 <p class="conFirst_rightBottom">
99 More>
100 </p>
101 </div>
102 </div>
103 <div class="conSecond"><!-- 灰色部分 -->
104 <div class="conSecond_chaqu">
105 <div class="conSecond_left"><!-- 教育专栏 -->
106 <div class="conSecond_leftTop">
107 <img src="images/z_e.png" alt="c"class="conSecond_leftTopPic">
108 <ul class="conFirst_rightTopPicWords">
109 <li class="match">教育专栏</li>
110 <li class="contest">ducation coiumn</li>
111 </ul>
112 <p class="conSecond_leftBottom">More></p>
113 </div>
114 <div class="conSecond_leftLower">
115 <div class="conSecond_leftLower_line1">
116 <span>
117 颁发荣誉证书，并赠送价值198元的作品集
118 </span>
119 <span class="conSecond_leftLower_line1Award">
120 2015-5-5
121 </span>
122 </div>
123 <div class="conSecond_leftLower_line2">
124 <span>
125 颁发荣誉证书，并赠送价值198元的作品集
126 </span>
127 <span class="conSecond_leftLower_line1Award">
128 2015-5-5
129 </span>
130 </div>
131 <div class="conSecond_leftLower_line2">
132 <span>
133 颁发荣誉证书，并赠送价值198元的作品集
134 </span>
135 <span class="conSecond_leftLower_line1Award">
136 2015-5-5
137 </span>
138 </div>
139 <div class="conSecond_leftLower_line2">
140 <span>
141 颁发荣誉证书，并赠送价值198元的作品集
142 </span>
143 <span class="conSecond_leftLower_line1Award">
144 2015-5-5
145 </span>
146 </div>
147 <div class="conSecond_leftLower_line2">
148 <span>
149 颁发荣誉证书，并赠送价值198元的作品集
150 </span>
151 <span class="conSecond_leftLower_line1Award">
152 2015-5-5
153 </span>
154 </div>
155 <div class="conSecond_leftLower_line2">
156 <span>
157 颁发荣誉证书，并赠送价值198元的作品集
158 </span>
159 <span class="conSecond_leftLower_line1Award">
160 2015-5-5
161 </span>
162 </div>
163 <div class="conSecond_leftLower_line2">
164 <span>
165 颁发荣誉证书，并赠送价值198元的作品集
166 </span>
167 <span class="conSecond_leftLower_line1Award">
168 2015-5-5
169 </span>
170 </div>
171 <div class="conSecond_leftLower_line2">
172 <span>
173 颁发荣誉证书，并赠送价值198元的作品集
174 </span>
175 <span class="conSecond_leftLower_line1Award">
176 2015-5-5
177 </span>
178 </div>
179 <div class="conSecond_leftLower_line2">
180 <span>
181 颁发荣誉证书，并赠送价值198元的作品集
182 </span>
183 <span class="conSecond_leftLower_line1Award">
184 2015-5-5
185 </span>
186 </div>
187 <div class="conSecond_leftLower_line2">
188 <span>
189 颁发荣誉证书，并赠送价值198元的作品集
190 </span>
191 <span class="conSecond_leftLower_line1Award">
192 2015-5-5
193 </span>
194 </div>
195 </div>
196 </div>
197 </div>
198 <div class="conSecond_right"><!-- 精品欣赏 -->
199 <div class="conSecond_rightTop">
200 <img src="images/z_f.png" alt="c"class="conSecond_leftTopPic">
201 <ul class="conFirst_rightTopPicWords">
202 <li class="match">精品欣赏</li>
203 <li class="contest">ine appreciation</li>
204 </ul>
205 <p class="conSecond_leftBottom">More></p>
206 </div>
207 <div class="conSecond_rightLower">
208 <div class="conSecond_rightLower_lp">
209 <img src="images/z_boy.jpg" alt="男孩" class="boy">
210 <p class="work">
211 并赠送价值198元的作品集
212 </p>
213 </div>
214 <div class="conSecond_rightLower_rp">
215 <div class="conSecond_rightLower_rpLt">
216 <img src="images/z_bangbangtang.jpg" alt="" class="conSecond_rightLower_rp_Lt">
217 <p class="zuopin">并赠送价值198元的作品集</p>
218 </div>
219 <div class="conSecond_rightLower_rpLt">
220 <img src="images/z_girleandboy.jpg" alt="" class="conSecond_rightLower_rp_Lt">
221 <p class="zuopin">并赠送价值198元的作品集</p>
222 </div>
223 </div>
224 <div class="conSecond_rightLower_rp">
225 <div class="conSecond_rightLower_rpLt">
226 <img src="images/z_xiaogirle.jpg" alt="" class="conSecond_rightLower_rp_Lt1">
227 <p class="zuopin">并赠送价值198元的作品集</p>
228 </div>
229 <div class="conSecond_rightLower_rpLt">
230 <img src="images/z_flower.jpg" alt="" class="conSecond_rightLower_rp_Lt1">
231 <p class="zuopin">并赠送价值198元的作品集</p>
232 </div>
233 </div>
234
235 </div>
236 </div>
237 </div>
238 <div class="conThree" id="three"><!-- 成长足迹 -->
239 <div class="conThree_left" >
240 <div class="conThree_leftTop" id="LeftTop">
241 <img src="images/z_leftShallow.jpg" alt="左" class="conThree_leftTop_line1" id="p_left">
242 <div class="conThree_leftTop_words">
243 <div>
244 <span class="meiyu" id="span1">成长</span>
245 <span class="teacher" id="span2">足迹</span>
246 </div>
247 <div class="rep">growing footprint</div>
248 </div>
249 <img src="images/z_rightShallow.jpg" alt="右" id="p_right" class="conThree_rightTop_line2">
250 </div>
251 <div class="conThree_leftLower">
252 <img src="images/z_dblboy.jpg" alt="" class="dblboy">
253 <p class="conThree_leftLower_words">198网络科技公司总经理李星燎</p>
254 </div>
255 </div>
256 <div class="conThree_middle">
257 <div class="conThree_leftTop">
258 <img src="images/z_leftShallow.jpg" alt="左" class="conThree_leftTop_line1">
259 <div class="conThree_leftTop_words"> <div>
260 <span class="meiyu">美誉</span>
261 <span class="teacher">教师</span>
262 </div>
263 <div class="rep">Reputation as a teacher</div>
264 </div>
265 <img src="images/z_rightShallow.jpg" alt="右" class="conThree_rightTop_line2">
266 </div>
267 <div class="conThree_leftLower">
268 <img src="images/z_threepeople.jpg" alt="" class="dblboy">
269 <p class="conThree_leftLower_words">198网络科技公司总经理李星燎</p>
270 </div>
271 </div>
272 <div class="conThree_middle">
273 <div class="conThree_leftTop">
274 <img src="images/z_leftShallow.jpg" alt="左" class="conThree_leftTop_line1">
275 <div class="conThree_leftTop_words"> <div>
276 <span class="meiyu">评委</span>
277 <span class="teacher">介绍</span>
278 </div>
279 <div class="intr">Introduction of the judges</div>
280 </div>
281 <img src="images/z_rightShallow.jpg" alt="右" class="conThree_rightTop_line2">
282 </div>
283 <div class="conThree_leftLower">
284 <img src="images/z_man.jpg" alt="" class="dblboy">
285 <p class="conThree_leftLower_words">198网络科技公司总经理李星燎</p>
286 </div>
287 </div>
288 </div>
289 <div class="conFourth"><!-- 大赛优势 -->
290 <div class="conFourth_good">
291 <p class="conFourth_goodWord">大赛优势</p>
292 <img src="images/z_changtu.png" alt="" class="conFourth_goodPicture">
293 </div>
294 <div class="conFourth_logo" id="logo"><!-- 各种图标 -->
295 <div class="conFourth_logo2">
296 <img src="images/z_logokuai.jpg" alt="方便快捷" class="aa">
297 <p class="conFourth_logo_tell">方便快捷</p>
298 </div>
299 <div class="conFourth_logo2">
300 <img src="images/z_logojiang.jpg" alt="奖项丰富">
301 <p class="conFourth_logo_tell">奖项丰富</p>
302 </div>
303 <div class="conFourth_logo2">
304 <img src="images/z_logopin.jpg" alt="奖品精美">
305 <p class="conFourth_logo_tell">奖品精美</p>
306 </div>
307 <div class="conFourth_logo2">
308 <img src="images/z_logoZheng.jpg" alt="权威公正">
309 <p class="conFourth_logo_tell">权威公正</p>
310 </div>
311 <div class="conFourth_logo2">
312 <img src="images/z_logoGong.jpg" alt="投身公益">
313 <p class="conFourth_logo_tell">投身公益</p>
314 </div>
315 <div class="conFourth_logo2">
316 <img src="images/z_logoFu.jpg" alt="服务行业">
317 <p class="conFourth_logo_tell">服务行业</p>
318 </div>
319 </div>
320 <div class="conFourth_handle"><!-- 网上操作快捷 -->
321 <p class="conFourth_handle_head">网上操作快捷</p>
322 <div class="clear"></div>
323 <p class="conFourth_handle_con">大赛实行了可网上操作，网上报名的便捷服务，参赛单位或个人可依据单位信息上传 报名及参赛总表，作品相片等信息。</p>
324 </div>
325 </div>
326 </div>
327 <!-- 中间主体部分结束 -->
328 <!-- 底部信息栏开始 -->
329 <div class="line"></div>
330 <div class="foot">
331 <div class="footTop"><!-- 上部分 -->
332 <ul class="footTop_list1">
333 <li class="footTop_list1Mine aaa">关于我们</li>
334 <li class="footTop_list1Org">组织机构</li>
335 <li>支持单位</li>
336 <li>专家阵容</li>
337 <li>支持媒体</li>
338 </ul>
339 <ul class="footTop_list2">
340 <li class="footTop_list2Match aaa">大赛一览</li>
341 <li>大赛介绍</li>
342 <li>主体形式</li>
343 <li>参赛对象</li>
344 <li>奖项设置</li>
345 <li>参赛须知</li>
346 </ul>
347 <ul class="footTop_list3">
348 <li class="aaa">名师名校</li>
349 <li>优秀教师</li>
350 <li>名校风采</li>
351 <li>教学心得</li>
352 </ul>
353 <ul class="footTop_list4">
354 <li class="aaa">搜索下载</li>
355 <li>成绩查询</li>
356 <li>下载海报</li>
357 <li>下载报名表</li>
358 <li>下载参赛表</li>
359 <li>下载参赛卡</li>
360 <li>下载电子书</li>
361 </ul>
362 <ul class="footTop_list5">
363 <li class="aaa footTop_list5_relation">联系我们</li>
364 <li class="footTop_list5_tel">400-888-8888</li>
365 <li class="footTop_list5_email">hr@inet198.com</li>
366 </ul>
367 </div>
368 <div class="footChaqu"></div>
369 <div class="footLower"><!-- 下部分 -->
370 <p class="footLower_top">
371 Copyright 2014 www.injet198.com 一九八网络科技（湖南）有限公司 版权所有 All Rights Reserved
372 </p>
373 <p class="footLower_middle">
374 公司地址：高新区文轩路27号麓谷钰园C1栋1101 服务电话：(0731)89837567 电子邮件：admin@injet198.com
375 </p>
376 <p class="footLower_bottom">
377 198网络 湘ICP备14005552号-1
378 </p>
379 </div>
380 </div>
381 <!-- 底部信息栏结束 -->
382 <!-- ============================JS========================== -->
383 <!-- JS部分代码开始 -->
384 <script type="text/javascript" src="js/enlarge.js"></script>
385 <script type="text/javascript" src="js/change.js"></script>
386 <!-- JS代码部分结束 -->
387
388 </body>
389 </html>
1 advantage:
2 .conFourth
3 {
4 width: 1100px;
5 min-width: 1100px;
6 margin: 0 auto;
7 }
8 .conFourth:before
9 {
10 content: "";
11 clear: both;
12 display: block;
13 }
14 .conFourth:after
15 {
16 content: "";
17 clear: both;
18 display: block;
19 }
20 .conFourth_good
21 {
22 text-align: center;
23 }
24 .conFourth_goodWord
25 {
26 font-size: 60px;
27 color: #32c87c;
28 margin-top: 78px;
29 }
30 .conFourth_goodPicture
31 {
32 margin-left: 80px;
33 }
34 .conFourth_logo
35 {
36 margin-top: 52px;
37 }
38 .conFourth_logo_tell
39 {
40 text-align: center;
41 font-size: 24px;
42 color: #999999;
43 position: relative;
44 left: 0px;
45 top: 31px;
46 }
47 .conFourth_logo2
48 {
49 width: 107px;
50 margin-left: 70px;
51 float: left;
52 height: 172px;
53 }
54 .conFourth_handle
55 {
56 margin-top: 73px;
57 float: left;
58 }
59 .conFourth_handle_head
60 {
61 text-align: center;
62 font-size: 36px;
63 color: #333333;
64 }
65 .conFourth_handle_con
66 {
67 text-align: center;
68 font-size: 18px;
69 color: #333;
70 margin-top: 26px;
71
72 }
73 .clear
74 {
75 clear: both;
76 }
77 .aa
78 {
79 position: relative;
80 }
1 bottom:
2 .line
3 {
4 width: 100%;
5 height: 4px;
6 background: #64c832;
7 margin-top: 45px;
8 min-width: 1100px;
9 }
10 .foot
11 {
12 background: #3f3f3f;
13 width: 100%;
14 min-width: 1100px;
15 margin: 0 auto;
16 }
17 .footTop
18 {
19 padding-top: 45px;
20 height: 235px;
21
22 }
23 .footTop_list1
24 {
25 padding-left: 188px;
26 float: left;
27 }
28 .footTop_list2
29 {
30 float: left;
31 margin-left: 116px;
32 }
33 .footTop_list3
34 {
35 float: left;
36 margin-left: 116px;
37 }
38 .footTop_list4
39 {
40 float: left;
41 margin-left: 113px;
42 }
43 .footTop_list5
44 {
45 float: left;
46 margin-left: 77px;
47 }
48 .footTop .footTop_list1 .footTop_list1Mine
49 {
50 color: #64c832;
51 }
52 .footTop li
53 {
54 color: #898989;
55 margin-top: 13px;
56 }
57 .footTop .footTop_list2Match
58 {
59 color: #dbdbdb;
60 }
61 .footTop .aaa
62 {
63 color: #dbdbdb;
64 padding-bottom: 5px;
65 border-bottom: 1px solid #646464;
66 }
67 .footTop .footTop_list1 .footTop_list1Org
68 {
69 color: #32c87c;
70 }
71 .footTop_list5 .footTop_list5_relation
72 {
73 width: 51px;
74 margin-left: 33px;
75 }
76 .footTop_list5_tel
77 {
78 padding-left: 33px;
79 background: url(../images/z_tel1.png) 0 0 no-repeat;
80 height: 20px;
81 line-height: 20px;
82 }
83 .footTop_list5_email
84 {
85 padding-left: 33px;
86 background: url(../images/z_email1.png) 0 0 no-repeat;
87 height: 17px;
88 line-height: 17px;
89 }
90 .footChaqu
91 {
92 width: 100%;
93 height: 1px;
94 background: #494848;
95 }
96 .footLower
97 {
98 width: 1100px;
99 margin: 0 auto;
100 }
101 .footLower_top
102 {
103 padding-top: 29px;
104 color: #898989;
105 text-align: center;
106 }
107 .footLower_middle,.footLower_bottom
108 {
109 margin-top: 13px;
110 color: #898989;
111 text-align: center;
112 }
1 dasaizixun:
2
3 .con
4 {
5 min-width: 1100px;
6 margin-top: 30px;
7 }
8 .conFirst
9 {
10 width: 1100px;
11 height: 350px;
12 margin: 0 auto;
13 }
14 .conFirst_leftBg,.conFirst_leftTxet
15 {
16 width: 670px;
17 height: 63px;
18 display: none;
19 position: absolute;
20 left: 0px;
21 bottom: 0px;
22 }
23 .conFirst_leftBg
24 {
25 background: #68cad2;
26 }
27 .conFirst_leftTxet
28 {
29 text-align: center;
30 line-height: 63px;
31 font-size: 16px;
32 color: #fff;
33 }
34 .conFirst_left:hover .conFirst_leftBg
35 {
36 display: block;
37 }
38 .conFirst_left:hover .conFirst_leftTxet
39 {
40 display: block;
41 }
42 .conFirst_left
43 {
44 position: relative;
45 width: 670px;
46 float: left;
47 }
48 .conFirst_leftTurnl
49 {
50 width: 30px;
51 height: 44px;
52 background: #9b9b99;
53 position: absolute;
54 left: 0px;
55 top: 145px;
56 padding-top: 16px;
57 text-align: center;
58 opacity: 0.4;filter:alpha(opacity=40);
59 }
60 .conFirst_leftTurnl:hover
61 {
62 background: #3c3c3c;
63 }
64 .conFirst_leftTurnr:hover
65 {
66 background: #3c3c3c;
67 }
68 .conFirst_leftTurnr
69 {
70 width: 30px;
71 height: 44px;
72 background: #9b9b99;
73 position: absolute;
74 right: 0px;
75 top: 145px;
76 padding-top: 16px;
77 text-align: center;
78 opacity: 0.4;filter:alpha(opacity=40);
79 }
80 .conFirst_right
81 {
82 float: left;
83 width: 400px;
84 height: 77px;
85 margin-left: 30px;
86 }
87 .conFirst_rightTop
88 {
89 width: 366px;
90 height: 78px;
91 border-bottom: 1px solid #e2e2e2;
92 }
93 .conFirst_rightTopPic
94 {
95 padding-top: 23px;
96 width: 28px;
97 float: left;
98 }
99 .conFirst_rightTopPicWords
100 {
101 float: left;
102 margin-left:9px;
103 padding-top: 23px;
104 font-size: 18px;
105 }
106 .match
107 {
108 color: #333;
109 }
110 .contest
111 {
112 color: #ccc;
113 }
114 .conFirst_rightMiddle
115 {
116 text-indent: 2em;
117 line-height: 30px;
118 }
119 .conFirst_rightBottom
120 {
121 float: right;
122 color: #32c87c;
123 }
1 education：
2 .conSecond
3 {
4 background: #e8e8e8;
5 height: 430px;
6 margin-top: 20px;
7
8 }
9 .conSecond_chaqu
10 {
11 width: 1100px;
12 min-width: 1100px;
13 margin: 0 auto;
14 }
15 .conSecond_left
16 {
17 float: left;
18 width: 339px;
19 }
20 .conSecond_leftTopPic
21 {
22 padding-top: 23px;
23 width: 28px;
24 float: left;
25 padding-bottom: 7px;
26 }
27 .conSecond_leftTop
28 {
29 border-bottom: 1px solid #fff;
30 width: 339px;
31 overflow: hidden;
32 }
33 .conSecond_leftBottom
34 {
35 float: right;
36 color: #32c87c;
37 padding-top: 58px;
38 }
39 .conSecond_leftLower
40 {
41 border-top: 1px solid #e2e2e2;
42 width: 366px;
43 }
44 .conSecond_leftLower_line1
45 {
46 padding-top: 25px;
47 }
48 .conSecond_leftLower_line1Award
49 {
50 margin-left:55px;
51 }
52 .conSecond_leftLower_line2
53 {
54 margin-top: 15px;
55 }
56 .conSecond_right
57 {
58 margin-left: 42px;
59 float: left;
60 }
61 .conSecond_rightTop
62 {
63 border-bottom: 1px solid #fff;
64 width: 719px;
65 float: left;
66 }
67 .conSecond_rightLower
68 {
69 border-top: 1px solid #ccc;
70 width: 719px;
71 height: 300px;
72 }
73 .conSecond_rightLower_lp
74 {
75 float: left;
76 }
77 .boy
78 {
79 padding-top: 27px;
80 }
81 .work
82 {
83 background: #fff;
84 opacity: 0.5;filter:alpha(opacity=50);
85 width: 330px;
86 height: 29px;
87 text-align: center;
88 line-height: 29px;
89 }
90 .conSecond_rightLower_rp
91 {
92 float: left;
93 }
94 .conSecond_rightLower_rp_Lt
95 {
96 padding-top: 27px;
97 }
98 .conSecond_rightLower_rpLt
99 {
100 position: relative;
101 margin-left: 9px;
102 float: left;
103 }
104 .zuopin
105 {
106 width: 185px;
107 height: 20px;
108 background: #fff;
109 position: absolute;
110 left: 0px;
111 bottom: 0px;
112 opacity: 0.5;filter:alpha(opacity=50);
113 text-align: center;
114 line-height: 20px;
115 display: none;
116 }
117 .conSecond_rightLower_rpLt:hover .zuopin
118 {
119 display: block;
120 }
121 .conSecond_rightLower_rp_Lt1
122 {
123 margin-top: 9px;
124 }
1 grow:
2 .conThree
3 {
4 width: 1100px;
5 min-width: 1100px;
6 margin: 0 auto;
7 }
8 .conthree:after
9 {
10 clear: both;
11 content: "";
12 display: block;
13 }
14 .conThree_left
15 {
16 margin-top: 30px;
17 width: 341px;
18 float: left;
19 }
20 .conThree_leftTop
21 {
22 overflow: hidden;
23 }
24 .conThree_leftTop_line1
25 {
26 float: left;
27 }
28 .conThree_leftTop_words
29 {
30 float: left;
31 margin-left: 10px;
32 margin-top: -5px;
33 }
34 .middle_left
35 {
36 float: left;
37 }
38 .middle_right
39 {
40 float: left;
41 margin-left: 1px;
42 margin-right: 10px;
43 }
44 .conThree_leftLower
45 {
46 margin-top: 24px;
47 overflow: hidden;
48 }
49 .conThree_leftLower_words
50 {
51 background: #64c832;
52 color: #fff;
53 text-align: center;
54 width: 339px;
55 height: 43px;
56 line-height: 43px;
57 float: left;
58 }
59 .dblboy
60 {
61 float: left;
62 }
63 .conThree_middle
64 {
65 margin-top: 30px;
66 width: 353px;
67 margin-left: 26px;
68 float: left;
69 }
70 .meiyu
71 {
72 font-size: 29px;
73 color: #323433;
74 padding-left: 6px;
75 }
76 .teacher
77 {
78 font-size: 29px;
79 color: #64c832;
80 }
81 .rep
82 {
83 color: #999999;
84 font-weight: normal;
85 }
86 .intr
87 {
88 font-size: 9px;
89 font-weight: normal;
90 letter-spacing: -1px;
91 }
1 head:
2
3
4 .head
5 {
6 width: 100%;
7 min-width: 1100px;
8 }
9 .headTop
10 {
11 height: 70px;
12 text-align: center;
13 line-height: 70px;
14 font-size: 20px;
15 overflow: hidden;
16 background: #64c832;
17 }
18 .welcome
19 {
20 font-size: 14px;
21 float: left;
22 padding-left: 52px;
23 }
24 .telephone
25 {
26 float: right;
27 margin-right:65px;
28 padding-left: 45px;
29 background: url(../images/z_tel.png) 0 19px no-repeat;
30 }
31 .email
32 {
33 float: right;
34 margin-right:79px;
35 padding-left: 51px;
36 background: url(../images/z_email.png) 0 19px no-repeat;
37 }
38 .headChaQu
39 {
40 height: 1px;
41 margin-top: 1px;
42 background: #ccc;
43 width: 100%;
44 }
45 .headMiddle
46 {
47 height: 101px;
48 width: 1100px;
49 margin: 0 auto;
50 border-top: 1px solid #f8f8f8;
51 font-size: 18px;
52 background: #fff;
53 }
54 .headMiddle:after
55 {
56 display: block;
57 content: "";
58 clear: both;
59 }
60 .headZhuoYi
61 {
62 float: left;
63 padding-left: 89px;
64 padding-top: 9px;
65 }
66 .headMiddleFirst
67 {
68 width: 145px;
69 height: 101px;
70 background: #32c87c;
71 margin-left: 96px;
72 text-align: center;
73 line-height: 101px;
74 float: left;
75 color: #ffff96;
76 }
77 .headIntroduce,.headTeacher,.headBoutique,.headAchieve
78 {
79 width: 143px;
80 height: 100px;
81 float: left;
82 border-right: 1px solid #dcdddd;
83 text-align: center;
84 line-height: 100px;
85 position: relative;
86 }
87 .er_headIntroduce
88 {
89 width: 142px;
90 height: 197px;
91 border: 1px solid #dcdddd;
92 display: none;
93 background: #fff;
94 }
95 .er_headTeacher
96 {
97 width: 143px;
98 height: 197px;
99 border: 1px solid #dcdddd;
100 border-left: 0px;
101 position: absolute;
102 top: 100px;
103 left: 0px;
104 display: none;
105 background: #fff;
106 }
107 .er_headAchieve
108 {
109 width: 143px;
110 height: 197px;
111 border: 1px solid #dcdddd;
112 margin-left: -1px;
113 display: none;
114 background: #fff;
115 }
116 .er_headIntroduce
117 {
118 position: absolute;
119 left: 0px;
120 top: 100px;
121 }
122 .er_headIntroduce li
123 {
124 width: 123px;
125 height: 35px;
126 border-top: 1px dashed #e6e6e6;
127 text-align: center;
128 line-height: 35px;
129 margin-left:11px;
130 font-size: 14px;
131 color: #dfdfdf;
132 }
133 li.er_headIntroduce_org
134 {
135 padding-top: 13px;
136 border-top: 0;
137 color: #79d7a3;
138 }
139 .san_headTeacher
140 {
141 border-bottom: 1px solid #e6e6e6;
142 height: 118px;
143 border-left: 1px solid #e6e6e6;
144 }
145 .san_headTeacher li
146 {
147 width: 123px;
148 height: 35px;
149 border-top: 1px dashed #e6e6e6;
150 text-align: center;
151 line-height: 35px;
152 margin-left:11px;
153 font-size: 14px;
154 color: #dfdfdf;
155 float: left;
156 }
157 .san_headTeacher .er_headTeacher_fine
158 {
159 padding-top: 13px;
160 border-top: 0;
161 }
162 .er_headAchieve .er_headAchieve_query
163 {
164 padding-top: 13px;
165 border-top: 0;
166 }
167 .san_headPrize
168 {
169 margin-top: 1px;
170 float: left;
171 }
172 .san_headPrize
173 {
174 height: 77px;
175 margin-top: 1px;
176 }
177 .san_headPrize li
178 {
179 width: 123px;
180 height: 35px;
181 border-top: 1px dashed #e6e6e6;
182 text-align: center;
183 line-height: 35px;
184 margin-left:11px;
185 font-size: 14px;
186 color: #dfdfdf;
187 }
188 .er_headAchieve li
189 {
190 width: 123px;
191 height: 35px;
192 border-top: 1px dashed #e6e6e6;
193 text-align: center;
194 line-height: 35px;
195 margin-left:11px;
196 font-size: 14px;
197 color: #dfdfdf;
198 }
199 .headIntroduce:hover .er_headIntroduce
200 {
201 display: block;
202 }
203 .headTeacher:hover .er_headTeacher
204 {
205 display: block;
206 }
207 .headAchieve:hover .er_headAchieve
208 {
209 display: block;
210 }
211 .headBottom
212 {
213 background: url(../images/z_bigPicture.png) center center no-repeat;
214 height: 436px;
215 }
1 reset:
2
3 @charset "utf-8";
4 /*=========================Reset_start==========================*/
5 body,h1,h2,h3,h4,h5,h6,div,p,dl,dt,dd,ol,ul,li,form,table,th,td,a,img,span,strong,var,em,input,textarea,select,option
6 {
7 margin: 0; padding: 0;
8 }
9 html,body
10 {
11 font-family:"微软雅黑","宋体",Arail,Tabhoma;
12 text-align: left;
13 color: #666666;
14 font-size: 12px;
15 font-weight: bold;
16 }
17 ul,ol
18 {
19 list-style: none;
20 }
21 img
22 {
23 border: 0 none;/*浏览器兼容问题，边框问题*/
24 }
25 input,select,textarea
26 {
27 outline:0;/*去除外面的实线*/
28 }
29 textarea
30 {
31 resize:none;/*固定文本框*/
32 overflow: auto;/*自定义的出现滚动条*/
33 }
34 table
35 {
36 border-collapse: collapse;
37 border-spacing: 0;
38 }
39 th,strong,var,em
40 {
41 font-weight: normal;
42 font-style: normal;
43 }
44 a
45 {
46 text-decoration: none;
47 }
48
49 /*==========================Reset_End===========================*/
1 change:
2
3 var da1=document.getElementsByClassName('conThree_leftTop');
4 var color1=document.getElementsByClassName('meiyu');
5 var color2=document.getElementsByClassName('teacher');
6 var imgs1=document.getElementsByClassName('conThree_leftTop_line1');
7 var imgs2=document.getElementsByClassName('conThree_rightTop_line2');
8 for (var i = 0; i < da1.length; i++) {
9 da1[i].onmouseover=function (){
10 for (var i = 0; i < da1.length; i++) {
11 if (da1[i]==this) {
12 imgs1[i].src="images/z_leftline.jpg";
13 imgs2[i].src="images/z_rightline.jpg";
14 imgs2[i].style.marginLeft="5px";
15 color1[i].style.color="#64c832";
16 color2[i].style.color="#323433";
17 };
18 };
19 };
20 da1[i].onmouseout=function (){
21 for (var i = 0; i < da1.length; i++) {
22 imgs1[i].src="images/z_leftShallow.jpg";
23 imgs2[i].src="images/z_rightShallow.jpg";
24 imgs2[i].style.marginLeft="5px";
25 color1[i].style.color="#323433";
26 color2[i].style.color="#64c832";
27 };
28
29 };
30 };
1 enlarge:
2 var z_logo=document.getElementById('logo');
3 var z_img=z_logo.getElementsByTagName('img');
4 var z_p=z_logo.getElementsByTagName('p');
5 for (var i = 0; i < z_img.length; i++) {
6 z_img[i].onmouseover=function(){
7 for (var i = 0; i < z_img.length; i++) {
8 if (z_img[i]==this) {
9 z_img[i].style.width="150px";
10 z_img[i].style.height="150px";
11 z_p[i].style.left="22px";
12 }
13 };
14 };
15 };
16 for (var i = 0; i < z_img.length; i++) {
17 z_img[i].onmouseout=function(){
18 for (var i = 0; i < z_img.length; i++) {
19 if (z_img[i]==this) {
20 z_img[i].style.width="106px";
21 z_img[i].style.height="107px";
22 z_p[i].style.left="";
23 };
24 };
25 };
26 };
