123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130 |
- *{
- margin:0;
- padding:0;
- font-family:microsoft yahei,'黑体';
- }
- #youdaoBanner{
- margin-top:15vh;
- height:85vh;
- position:relative;
- }
- #youdaoBanner .swiper-slide{
- width: 315px;
- padding:0 30px;
- position:relative;
- border-radius: 5px;
- overflow: hidden;
- }
- #youdaoBanner .swiper-slide .bg{
- height: 200px;
- background-repeat: no-repeat;
- background-position: center top;
- position:relative;
- overflow:hidden;
- }
- #youdaoBanner .swiper-slide .white-top{
- background:url(../images/white-top.png);
- position:absolute;
- z-index:900;
- top:0;
- left:0;
- width:100%;
- height:8px;
- }
- #youdaoBanner .swiper-slide .white-bottom{
- background:url(../images/white-bottom.png);
- position:absolute;
- z-index:900;
- bottom:0;
- left:0;
- width:100%;
- height:8px;}
- #youdaoBanner .bg .black-mask{
- width:315px;
- height:200px;
- position:absolute;
- z-index:1;
- top:0;
- left:0;
- background:url(../images/black-mask.png);
- border-radius: 10px;
- }
- #youdaoBanner .bg:hover .black-mask{
- display:none;
- }
- #youdaoBanner .swiper-button-prev,#youdaoBanner .swiper-button-next{
- position:absolute;
- z-index:999;
- top:85%;
- left:35%;
- margin-top:-30px;
- margin-left:-30px;
- width: 60px;
- height: 60px;
- background:url(../images/swiper-btn.png);
- cursor:pointer;
- /* display:none; */
- }
- #youdaoBanner .swiper-button-next{
- background-position:0 -60px;
- left:65%;
- /* right:10px; */
- }
- #youdaoBanner:hover .swiper-button-prev,#youdaoBanner:hover .swiper-button-next{
- display:block;
- }
- #youdaoBanner .slide1 .bg{background-image:url(../images/banner/Obanner1.jpg);background-repeat:no-repeat; background-size:100% 100%;-moz-background-size:100% 100%;}
- #youdaoBanner .slide2 .bg{background-image:url(../images/banner/Obanner2.jpg);background-repeat:no-repeat; background-size:100% 100%;-moz-background-size:100% 100%;}
- #youdaoBanner .slide3 .bg{background-image:url(../images/banner/Obanner3.jpg);background-repeat:no-repeat; background-size:100% 100%;-moz-background-size:100% 100%;}
- #youdaoBanner .slide4 .bg{background-image:url(../images/banner/Obanner4.jpg);background-repeat:no-repeat; background-size:100% 100%;-moz-background-size:100% 100%;}
- #youdaoBanner .slide5 .bg{background-image:url(../images/banner/Obanner5.jpg);background-repeat:no-repeat; background-size:100% 100%;-moz-background-size:100% 100%;}
- #youdaoBanner .slide6 .bg{background-image:url(../images/banner/Obanner6.jpg);background-repeat:no-repeat; background-size:100% 100%;-moz-background-size:100% 100%;}
- #youdaoBanner .swiper-slide .bg:hover{
- /* background: url(../images/fire.png) #fc6760 340px 210px no-repeat; */
- }
- #youdaoBanner .info{
- position: absolute;
- padding:30px;
- z-index:999;
- bottom: -149px;
- color:#fff;
- font-size:14px;
- padding-top:30px;
- }
- #youdaoBanner .info .date{
- font-size: 14px;
- margin-bottom: 16px;
- }
- #youdaoBanner .info h3{
- margin-bottom: 18px;
- }
- #youdaoBanner .info h3 a{
- color: #fff;
- font-size: 24px;
- font-weight: 500;
- text-decoration:none;
- }
- #youdaoBanner .info p{
- text-indent:2em;
- font-size: 16px;
- }
- #youdaoBanner .info .btn{
- margin-top: 40px;
- display:block;
- color: #fff;
- font-size: 16px;
- text-align:center;
- width:106px;
- height:42px;
- line-height: 40px;
- text-decoration:none;
- background:url(../images/link_bg.png) no-repeat;
- }
- #youdaoBanner .info .btn:hover{
-
- color:#000;
- background:url(../images/link_bg.png) no-repeat left -42px;
- }
|