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 };