/*公共样式*/ *{ padding: 0; margin: 0; } ul li{ list-style:none; } a{ text-decoration:none; } .interval{ width: 100%; height: 50px; } .interval2{ width: 100%; height: 150px; } /*头部*/ header{ width: 100%; height: 80px; background: url(../img/tou.jpg); } .headline{ text-align: center; line-height: 80px; font-size: 35px; font-weight: 590; color: #fff; } .headline span{ color: #FFDE00; font-weight: bolder; } /*logo*/ .logo{ width: 80%; height: 150px; margin: 0 auto; } .logo .logol{ display: inline-block; width: 25%; height: 80%; text-align: center; float: left; margin-top: 25px; } .logo .logol .logol_img{ width: 100%; height: 70px; } .logo .logol .logol_img img{ width: 100%; } .logo .logol .logol_text{ width: 100%; height: 40px; } .logo .logol .logol_text p{ color: #008cd4; font-size: 18px; } .logo .logoc{ display: inline-block; width: 30%; height: 100%; float: left; } .logo .logoc .logoc_text{ margin-top: 5px; width: 100%; height: 80px; text-align: center; } .logo .logoc .logoc_text h1{ color: #FB3447; line-height: 87px; font-size: 35px; } .logo .logoc .logoc_img{ width: 100%; height: 70px; } .logo .logoc .logoc_img .logoc_img1{ float: left; width: 25%; text-align: right; } .logo .logoc .logoc_img .logoc_img2{ float: left; width: 70%; } .logo .logoc .logoc_img .logoc_img2 p{ font-size: 28px; font-family: "微软雅黑"; font-weight: bolder; font-style: italic; } .logo .logor{ display: inline-block; width: 25%; height: 80%; float: right; margin-top: 25px; } .logo .logor .logor_text{ width: 60%; height: 80%; float: left; text-align: center; } .logo .logor .logor_text p{ font-size: 20px; line-height: 50px; color: #000; } .logo .logor .logor_text p span{ color: #FB3447; } .logo .logor .logor_text h2{ color: #008cd4; font-size: 32px; line-height: 45px; } .logo .logor .logor_img{ width: 40%; height: 80%; float: left; } .logo .logor .logor_img img{ height: 100%; } .xian{ display: inline-block; width: 10%; height: 100%; text-align: center; float: left; } .xian img{ margin-top: 20px; } /*导航栏*/ nav{ width: 100%; height: 50px; background: #008cd4; } nav ul{ width: 80%; height: 100%; margin: 0 auto; } nav ul li{ width: 9%; height: 100%; float: left; text-align: center; } nav ul li a{ color: #fff; line-height: 50px; } nav ul li a:hover{ color: #000; } /*banner*/ .banner{ width: 100%; height: 450px; position: relative; } .banner a img{ width: 100%; height: 100%; } .banner ul{ width: 15%; height: 100%; background: #000; background:rgba(0,0,0,.5); color: #fff; text-align: center; line-height: 45px; position: absolute; top: 0; left: 0; right: 60%; bottom: 0; margin: 0 auto; } .banner ul li{ width: 100%; height: 10%; } .banner ul li a{ display: inline-block; color: #fff; width: 100%; height: 100%; font-size: 14px; } .banner ul li a:hover{ background: #e3242c; } /*推荐课*/ .recommend{ width: 75%; height: 250px; margin: 0 auto; } .recommend ul{ width: 100%; height: 100%; } .recommend ul li{ width: 23%; height: 100%; float: left; margin: 1%; } .recommend ul li a{ display: inline-block; width: 100%; height: 100%; color: #fff; } .recommend ul li .recommend_img{ width: 100%; height: 70%; } .recommend ul li .recommend_img img{ width: 100%; height: 100%; border: 1px solid #fff; border-radius: 15px; } .recommend ul li .recommend_text{ width: 100%; height: 30%; text-align: center; background: #008cd4; border: 1px solid #fff; border-radius: 15px; } .recommend ul li .recommend_text h3{ line-height: 40px; } /*优秀学生*/ .student{ width: 80%; height: 500px; margin: 0 auto; } .student .student1{ width: 58%; height: 100%; float: left; } .student .student1 .student1_title{ display: inline-block; width: 100%; height: 49px; line-height: 49px; color: #008cd4; font-size: 28px; font-weight: bold; border-bottom: 1px dashed #000; margin-bottom: 20px; } .student .student1 ul{ width: 100%; height: 420px; } .student .student1 ul li{ width: 31%; height: 100%; float: left; margin-left: 2%; text-align: center; } .student .student1 ul li .student1_img{ width: 100%; height: 320px; } .student .student1 ul li .student1_img img{ width: 100%; height: 85%; } .student .student1 ul li .student1_p1{ display: inline-block; width: 100%; height: 30px; background: #008cd4; color: #fff; line-height: 30px; font-size: 14px; } .student .student1 ul li .student1_p2{ display: inline-block; width: 100%; height: 30px; font-size: 16px; line-height: 30px; } .student .student1 ul li .student1_p2 span{ font-size: 18px; font-weight: bold; } .student .dynamic{ width: 35%; height: 100%; float: right; } .student .dynamic_title{ display: inline-block; width: 100%; height: 49px; line-height: 49px; font-size: 20px; border-bottom: 1px dashed #000; margin-bottom: 20px; } .student .dynamic_table{ width: 100%; height: 420px; background: #E3242C; border: 1px solid #fff; border-radius: 10px; text-align: center; } .student .dynamic_table p{ display: inline-block; width: 100%; height: 50px; color: #fff; line-height: 50px; } .student .dynamic_table .dowebok{ width: 93%; height: 350px; margin: 0 auto; line-height: 30px; background: #fff; } .student .dynamic_table .dowebok ul{ width: 93%; height: 350px; background: #fff; margin: 0 auto; } .student .dynamic_table .dowebok ul li{ width: 100%; height: 10%; line-height: 35px; } /*优秀学生成绩*/ .grade1{ width: 80%; height: 365px; margin: 0 auto; } .grade1 .grade1_title{ width: 100%; height: 35px; background-image: url(../img/tu12.jpg); } .grade1 .grade1_title a{ line-height: 35px; color: #fff; margin-left: 15px; } .grade1 ul{ width: 100%; height: 50px; text-align: center; line-height: 50px; } .grade1 .list_title{ margin-top: 25px; background-color: #999; } .grade1 ul .list1{ width: 10%; height: 100%; border-bottom: 1px solid #b5b5b5; border-left: 1px solid #b5b5b5; float: left; } .grade1 ul .list2{ width: 10%; height: 100%; float: left; border-bottom: 1px solid #b5b5b5; border-left: 1px solid #b5b5b5; } .grade1 ul .list3{ width: 15%; height: 100%; float: left; border-bottom: 1px solid #b5b5b5; border-left: 1px solid #b5b5b5; } .grade1 ul .list4{ width: 15%; height: 100%; float: left; border-bottom: 1px solid #b5b5b5; border-left: 1px solid #b5b5b5; } .grade1 ul .list5{ width: 12%; height: 100%; float: left; border-bottom: 1px solid #b5b5b5; border-left: 1px solid #b5b5b5; } .grade1 ul .list6{ width: 13%; height: 100%; float: left; border-bottom: 1px solid #b5b5b5; border-left: 1px solid #b5b5b5; } .grade1 ul .list7{ width: 24%; height: 100%; float: left; border-bottom: 1px solid #b5b5b5; border-left: 1px solid #b5b5b5; border-right: 1px solid #b5b5b5; } .grade1 ul .list7 a{ color: #fb3447; } .grade1 ul .list8{ width: 24%; height: 100%; float: left; border-bottom: 1px solid #b5b5b5; border-left: 1px solid #b5b5b5; } /*精彩课程*/ .course1{ width: 80%; height: 420px; margin: 0 auto; } .course1 .course1_title{ width: 100%; height: 35px; background-image: url(../img/tu12.jpg); } .course1 .course1_title a{ line-height: 35px; color: #fff; margin-left: 30px; } .course1 .course1_img{ width: 95%; height: 370px; margin: 0 auto; margin-top: 25px; } .course1 .course1_img img{ width: 100%; height: 100%; } .course1 .course1_img a:nth-child(1){ display: inline-block; width: 20%; height: 90%; float: left; } .course1 .course1_img a:nth-child(2){ display: inline-block; width: 37%; height: 90%; margin-left: 1%; float: left; } .course1 .course1_img a:nth-child(3){ display: inline-block; width: 20%; height: 90%; margin-left: 1%; float: left; } .course1 .course1_img a:nth-child(4){ display: inline-block; width: 20%; height: 90%; margin-left: 1%; float: left; } /*家长大学*/ .patriarch{ width: 80%; height: 610px; margin: 0 auto; } .patriarch .patriarch_title{ display: inline-block; width: 58%; height: 49px; line-height: 49px; color: #008cd4; font-size: 28px; font-weight: bold; border-bottom: 1px dashed #000; } .patriarch .patriarch_1{ width: 100%; height: 530px; margin-top: 15px; } .patriarch .patriarch_1 .patriarch_dynamic{ width: 45%; height: 100%; float: left; } .patriarch .patriarch_1 .patriarch_dynamic .patriarch_dynamic_title1{ width: 100%; height: 90px; color: #fff; text-align: center; line-height: 90px; font-size: 26px; background-image: url(../img/biaotilian.png); background-repeat: no-repeat; background-size: 100%; } .patriarch .patriarch_1 .patriarch_dynamic .patriarch_dynamic_title2{ width: 90%; height: 42px; text-align: center; line-height: 42px; border: 2px solid #008cd4; margin: 0 auto; } .patriarch .patriarch_1 .patriarch_dynamic .dowebok{ width: 89%; height: 382px; margin: 0 auto; border: 4px solid #ffb0b0; } .patriarch .patriarch_1 .patriarch_dynamic ul{ width: 100%; height: 100%; } .patriarch .patriarch_1 .patriarch_dynamic ul li{ width: 100%; height: 10%; text-align: center; line-height: 38px; border-bottom: 1px dashed #000; } .patriarch .patriarch_1 .patriarch_video{ width: 53%; height: 450px; float: right; margin-top: 60px; } .patriarch .patriarch_1 .patriarch_video ul{ width: 95%; height: 100%; margin: 0 auto; } .patriarch .patriarch_1 .patriarch_video ul li{ width: 31%; height: 100%; float: left; margin-left: 2%; } .patriarch .patriarch_1 .patriarch_video ul li a{ display: inline-block; width: 100%; height: 80%; } .patriarch .patriarch_1 .patriarch_video ul li a img{ width: 100%; height: 100%; } .patriarch .patriarch_1 .patriarch_video ul li .patriarch_video_p1{ display: inline-block; width: 100%; height: 10%; background: #008cd4; color: #fff; font-size: 14px; text-align: center; line-height: 45px; } .patriarch .patriarch_1 .patriarch_video ul li .patriarch_video_p2,.patriarch_video_p3{ width: 100%; height: 5%; } /*优秀家长学员*/ .excellent{ width: 80%; height: 380px; margin: 0 auto; } .excellent .excellent_title{ width: 100%; height: 35px; background-image: url(../img/tu12.jpg); } .excellent .excellent_title a{ line-height: 35px; color: #fff; margin-left: 15px; } .excellent ul{ width: 95%; height: 320px; margin: 0 auto; } .excellent ul li{ width: 19%; height: 100%; float: left; margin-left: 1%; margin-top: 25px; } .excellent ul li a img{ width: 100%; height: 100%; } .excellent ul li a{ display: inline-block; width: 100%; height: 100%; position: relative; } .excellent ul li a p{ display: inline-block; width: 100%; height: 15%; line-height: 48px; background: #fff; text-align: center; position: absolute; left: 0; right: 0; bottom: 0; margin: 0 auto; opacity: 0.7; } /*精彩课程*/ .course2{ width: 80%; height: 400px; margin: 0 auto; } .course2 .course2_title{ width: 100%; height: 35px; background-image: url(../img/tu12.jpg); } .course2 .course2_title a{ line-height: 35px; color: #fff; margin-left: 30px; } .course2 .course2_img{ width: 95%; height: 340px; margin: 0 auto; margin-top: 25px; } .course2 .course2_img img{ width: 100%; height: 100%; } .course2 .course2_img a:nth-child(1){ display: inline-block; width: 37%; height: 90%; float: left; } .course2 .course2_img a:nth-child(2){ display: inline-block; width: 20%; height: 90%; margin-left: 1%; float: left; } .course2 .course2_img a:nth-child(3){ display: inline-block; width: 20%; height: 90%; margin-left: 1%; float: left; } .course2 .course2_img a:nth-child(4){ display: inline-block; width: 20%; height: 90%; margin-left: 1%; float: left; } /*优秀教师*/ .teacher{ width: 80%; height: 450px; margin: 0 auto; } .teacher .teacher_title{ width: 58%; height: 49px; line-height: 49px; color: #008cd4; font-size: 28px; font-weight: bold; border-bottom: 1px dashed #000; } .teacher .teacher_introduce{ display: inline-block; width: 100%; height: 50px; background: #3795df; color: #fff; line-height: 50px; margin-top: 25px; margin-bottom: 25px; text-indent: 1em; } .teacher ul{ width: 99%; height: 300px; margin: 0 auto; } .teacher ul li{ width: 19%; height: 100%; margin-left: 1%; float: left; } .teacher ul li img{ width: 100%; height: 100%; } /*精彩课程*/ .course3{ width: 80%; height: 420px; margin: 0 auto; } .course3 .course3_title{ width: 100%; height: 35px; background-image: url(../img/tu12.jpg); } .course3 .course3_title a{ line-height: 35px; color: #fff; margin-left: 30px; } .course3 .course3_img{ width: 95%; height: 340px; margin: 0 auto; margin-top: 25px; } .course3 .course3_img img{ width: 100%; height: 100%; } .course3 .course3_img a:nth-child(1){ display: inline-block; width: 37%; height: 90%; float: left; } .course3 .course3_img a:nth-child(2){ display: inline-block; width: 20%; height: 90%; margin-left: 1%; float: left; } .course3 .course3_img a:nth-child(3){ display: inline-block; width: 20%; height: 90%; margin-left: 1%; float: left; } .course3 .course3_img a:nth-child(4){ display: inline-block; width: 20%; height: 90%; margin-left: 1%; float: left; } /*优秀师资*/ .faculty{ width: 80%; height: 470px; margin: 0 auto; } .faculty .faculty_title{ width: 100%; height: 35px; background-image: url(../img/tu12.jpg); } .faculty .faculty_title a{ line-height: 35px; color: #fff; margin-left: 15px; } .faculty ul{ width: 95%; height: 410px; margin: 0 auto; margin-top: 25px; } .faculty ul li{ width: 24%; height: 100%; float: left; margin-left: 1%; } .faculty ul li a img{ width: 100%; height: 100%; } .faculty ul li a{ display: inline-block; width: 100%; height: 100%; position: relative; color: #313131; } .faculty ul li a p{ display: inline-block; width: 100%; height: 10%; line-height: 37px; background: #fff; text-align: center; position: absolute; left: 0; right: 0; bottom: 0; margin: 0 auto; opacity: 0.7; } /*新闻资讯*/ .news{ width: 80%; height: 500px; margin: 0 auto; } .news .news_title{ width: 100%; height: 35px; background-image: url(../img/tu12.jpg); } .news .news_title a{ line-height: 35px; color: #fff; margin-left: 30px; } .news .news1{ width: 100%; height: 440px; margin-top: 25px; } .news .news1 .news1_l{ width: 28%; height: 440px; float: left; } .news .news1 .news1_l .news1_l_t{ display: inline-block; width: 97%; height: 50%; color: #000; margin-left: 1%; } .news .news1 .news1_l .news1_l_t_img{ width: 100%; height: 80%; } .news .news1 .news1_l .news1_l_t_img img{ width: 100%; height: 100%; } .news .news1 .news1_l .news1_l_t p{ display: inline-block; width: 100%; height: 20%; background-color: #fff; text-align: center; line-height: 37px; } .news .news1 .news1_l ul{ width: 100%; height: 50%; } .news .news1 .news1_l ul li{ width: 48%; height: 50%; float: left; margin-left: 1%; } .news .news1 .news1_l ul li a{ display: inline-block; width: 100%; height: 100%; color: #000; } .news .news1 .news1_l ul li a div{ width: 100%; height: 80%; } .news .news1 .news1_l ul li a div img{ width: 100%; height: 100%; } .news .news1 .news1_l ul li a p{ display: inline-block; width: 100%; height: 20%; background-color: #fff; text-align: center; } .news .news1 .news1_c{ width: 50%; height: 440px; float: left; margin-left: 1%; margin-right: 1%; } .news .news1 .news1_c .news1_c_1{ width: 100%; height: 38%; } .news .news1 .news1_c .news1_c_1 .news1_c_1_ul{ width: 100%; height: 20%; margin: 0 auto; line-height: 33px; text-align: center; } .news .news1 .news1_c .news1_c_1 .news1_c_1_ul li{ width: 32%; height: 100%; float: left; position: relative; } .active{ border-top: 2px solid #3795df; } .active:after{ content: ""; display: inline-block; width: 0px; height: 0px; position: absolute; left: 0; right: 0; bottom: -16px; margin: auto; } .con{ width: 100%; height: 60%; margin-top: 2%; } .con ul{ width: 100%; height: 100%; display: none; } .con ul>li{ width: 32%; height: 100%; float: left; margin-right: 1%; } .con ul>li img{ width: 100%; height: 100%; } .con ul>li:last-child{ margin-right: 0; } .news .news1 .news1_c .news1_c_ul{ width: 100%; height: 60%; margin-top: 2%; } .news .news1 .news1_c .news1_c_ul li{ width: 100%; height: 12%; border-bottom: 1px solid #1b1b1b; } .news .news1 .news1_c .news1_c_ul li a{ display: inline-block; width: 70%; height: 100%; color: #1b1b1b; float: left; text-indent: 1em; line-height: 31px; } .news .news1 .news1_c .news1_c_ul li p{ display: inline-block; width: 10%; height: 100%; color: #1b1b1b; float: right; line-height: 31px; } .aside{ width: 20%; height: 400px; float: right; } .aside ul{ width: 100%; height: 100%; } .aside ul li{ width: 75%; height: 20%; border-bottom: 1px dashed #acacac; } .aside ul li:nth-child(5){ border-bottom: 1px dashed #fff; } .aside ul li .aside_img{ width: 40%; height: 100%; float: left; } .aside ul li .aside_img img{ margin-top: 10px; } .aside ul li:nth-child(1) .aside_img img{ margin-top: 15px; } .aside ul li .aside_text{ width: 60%; height: 100%; float: left; } .aside ul li .aside_text p{ margin-top: 15px; line-height: 28px; font-size: 14px; } .aside ul li:nth-child(4) .aside_text p:nth-child(1){ margin-top: 15px; line-height: 15px; } .aside ul li:nth-child(4) .aside_text p:nth-child(2){ margin-top: 5px; } .aside .aside_code1{ width: 48%; height: 100%; float: left; text-align: center; margin-top: 10px; } .aside .aside_code2{ width: 48%; height: 100%; float: right; text-align: center; margin-top: 10px; } .aside ul li:nth-child(5) p{ font-size: 14px; } /*友情链接*/ .blogroll{ width: 80%; height: 45px; margin: 0 auto; } .blogroll .blogroll_title{ width: 100%; height: 35px; background-image: url(../img/tu12.jpg); } .blogroll .blogroll_title .blogroll_title_a{ display: inline-block; width: 14%; height: 35px; line-height: 35px; color: #fff; text-indent: 2em; float: left; } .blogroll .blogroll_title ul{ width: 86%; height: 35px; float: left; } .blogroll .blogroll_title ul li{ width: 7%; height: 100%; float: left; } .blogroll .blogroll_title ul li:nth-child(13){ float: right; } .blogroll .blogroll_title ul li a{ display: inline-block; width: 100%; height: 100%; font-size: 14px; text-align: center; color: #000; line-height: 35px; } /*底部*/ .footer{ width: 100%; height: 290px; background: #DCDCDC; } .footer ul{ width: 70%; height: 100px; margin: 0 auto; } .footer ul li{ width: 9%; height: 100%; float: left; text-align: center; } .footer ul li a{ color: #000; line-height: 100px; } .footer .footer_base{ width: 90%; height: 150px; margin: 0 auto; font-size: 14px; } .footer .footer_base .footer_base_l{ width: 20%; height: 100%; float: left; margin-left: 10%; margin-top: 40px; } .footer .footer_base .footer_base_c{ width: 40%; height: 100%; float: left; text-align: center; margin-top: 10px; } .footer .footer_base .footer_base_c p{ line-height: 30px; } .footer .footer_base .footer_base_r{ width: 20%; height: 100%; float: left; text-align: center; } /*公用样式*/ /*快讯*/ .news3{ width: 70%; height: 600px; margin: 0 auto; } .news3 h1{ font-size: 40px; font-family:"黑体"; text-align: center; color: #2f373b; } .news3 ul{ width: 100%; height: 400px; margin-top: 50px; } .news3 ul li{ width: 47%; height: 33%; float: left; background-color: #e1e2e4; margin-top: 2%; } .news3 ul li:nth-child(2){ float: right; } .news3 ul li:nth-child(4){ float: right; } .news3 ul li:nth-child(6){ float: right; } .news3 ul li .news3_img{ display: inline-block; width: 35%; height: 100%; float: left; } .news3 ul li .news3_img img{ width: 100%; height: 100%; } .news3 ul li .news3_text{ display: inline-block; width: 65%; height: 100%; float: right; } .news3 ul li .news3_text h3{ line-height: 50px; margin-left: 3%; color: #2f373b; } .news3 ul li .news3_text p{ font-size: 14px; color: #666666; margin-left: 3%; margin-right: 3%; } /*导航栏*/ .nav1{ width: 80%; height: 50px; background: #008cd4; margin: 0 auto; } .nav1 ul{ width: 100%; height: 100%; } .nav1 ul li{ width: 9%; height: 100%; float: left; text-align: center; } .nav1 ul li a{ color: #fff; line-height: 50px; } .nav1 ul li a:hover{ color: #000; }