#header { height: 490px; overflow: hidden; background: url(/uploads/image/yqimg/back.jpg) top center; } #header .w { position: relative; } #header .w .q { position: absolute; top: 135px; left: 256px; width: 182px; height: 160px; background: url(/uploads/image/yqimg/q.png) no-repeat; z-index: 100; } #header .w .k { position: absolute; top: 108px; left: 450px; width: 124px; height: 133px; background: url(/uploads/image/yqimg/k.png) no-repeat; } #header .w .w0 { position: absolute; top: 188px; left: 570px; width: 144px; height: 138px; background: url(/uploads/image/yqimg/w.png) no-repeat; } #header .w .w1 { position: absolute; top: 123px; left: 690px; width: 159px; height: 168px; background: url(/uploads/image/yqimg/w1.png) no-repeat; } #header .w .xhw { position: relative; top: 410px; left: 385px; width: 360px; height: 41px; display: block; /* animation-delay: 1s; animation: fadein 3s; */ background: url(/uploads/image/yqimg/logo.png) no-repeat; } #new { height: 665px; /* overflow: hidden; */ } #new .new { width: 165px; height: 50px; margin: 58px auto 60px; /* overflow: hidden; */ } #old { background: url(/uploads/image/yqimg/back.jpg) top center; overflow: hidden; } #old .old { width: 118px; height: 41px; margin: 80px auto 60px; } #container ul { display: none; /* display: none; */ width: 1160px; margin: 0 auto; overflow: hidden; } #container ul li { float: left; margin: 0px 0px 60px 60px; } #container ul li a { display: block; } #old .ckgd { width: 325px; height: 50px; margin: 0 auto 120px; background: url(/uploads/image/yqimg/border.png) no-repeat; } #old .ckgd p { color: #fff; font-size: 22px; display: block; text-align: center; line-height: 50px; } /* .on { display: block; } .old_content .on { display: block; } */ #footer { height: 243px; margin: 0 auto; overflow: hidden; background-color: #222222; } #footer p { padding-top: 85px; font-size: 24px; color: #fdfefe; text-align: center; line-height: 45px; } /* @keyframes asd { 0% { transform: rotate(0deg); left: 2000px; } 100% { transform: rotate(0deg); left: 370px; } } */ /* 动画q*/ @-ms-keyframes q1 { from { filter: alpha(opacity=0); opacity: 0; top: -200px; } } @-moz-keyframes q1 { from { filter: alpha(opacity=0); opacity: 0; top: -200px; } } @-o-keyframes q1 { from { filter: alpha(opacity=0); opacity: 0; top: -200px; } } @-webkit-keyframes q1 { from { filter: alpha(opacity=0); opacity: 0; top: -200px; } } @keyframes q1 { from { filter: alpha(opacity=0); opacity: 0; top: -200px; } } .q1 { animation: 'q1' 0.4s ease-in-out 0s normal; -ms-animation: q1 0.4s ease-in-out 0s normal; -moz-animation: q1 0.4s ease-in-out 0s normal; -o-animation: 'q1' 0.4s ease-in-out 0s normal; -webkit-animation: 'q1' 0.8s ease-in-out 0s normal; } /* 动画k*/ @-ms-keyframes k2 { from { filter: alpha(opacity=0); opacity: 0; top: -200px; } } @-moz-keyframes k2 { from { filter: alpha(opacity=0); opacity: 0; top: 200px; } } @-o-keyframes k2 { from { filter: alpha(opacity=0); opacity: 0; top: 200px; } } @-webkit-keyframes k2 { from { filter: alpha(opacity=0); opacity: 0; top: 200px; } } @keyframes k2 { from { filter: alpha(opacity=0); opacity: 0; top: 200px; } } .k2 { animation: 'k2' 1.2s ease-in-out 0s normal; -ms-animation: k2 1.2s ease-in-out 0s normal; -moz-animation: k2 1.2s ease-in-out 0s normal; -o-animation: 'k2' 1.2s ease-in-out 0s normal; -webkit-animation: 'k2' 1.2s ease-in-out 0s normal; } /* 动画w0 */ @-ms-keyframes w01 { from { filter: alpha(opacity=0); opacity: 0; transform: scale(3, 3); } 39.23% { filter: alpha(opacity=0); opacity: 0; transform: scale(3, 3); } } @-moz-keyframes w01 { from { filter: alpha(opacity=0); opacity: 0; transform: scale(3, 3); } 39.23% { filter: alpha(opacity=0); opacity: 0; transform: scale(3, 3); } } @-o-keyframes w01 { from { filter: alpha(opacity=0); opacity: 0; transform: scale(3, 3); } 39.23% { filter: alpha(opacity=0); opacity: 0; transform: scale(3, 3); } } @-webkit-keyframes w01 { from { filter: alpha(opacity=0); opacity: 0; transform: scale(3, 3); } 39.23% { filter: alpha(opacity=0); opacity: 0; transform: scale(3, 3); } } @keyframes w01 { from { filter: alpha(opacity=0); opacity: 0; transform: scale(3, 3); } 39.23% { filter: alpha(opacity=0); opacity: 0; transform: scale(3, 3); } } .w01 { animation: 'w01' 1.2s ease-in-out 0s normal; -ms-animation: w01 1.2s ease-in-out 0s normal; -moz-animation: w01 1.2s ease-in-out 0s normal; -o-animation: 'w01' 1.2s ease-in-out 0s normal; -webkit-animation: 'w01' 1.2s ease-in-out 0s normal; } /* 动画w1 */ @-ms-keyframes w11 { from { filter: alpha(opacity=0); opacity: 0; transform: scale(6, 6); } 69.23% { filter: alpha(opacity=0); opacity: 0; transform: scale(6, 6); } } @-moz-keyframes w11 { from { filter: alpha(opacity=0); opacity: 0; transform: scale(6, 6); } 69.23% { filter: alpha(opacity=0); opacity: 0; transform: scale(6, 6); } } @-o-keyframes w11 { from { filter: alpha(opacity=0); opacity: 0; transform: scale(6, 6); } 69.23% { filter: alpha(opacity=0); opacity: 0; transform: scale(6, 6); } } @-webkit-keyframes w11 { from { filter: alpha(opacity=0); opacity: 0; transform: scale(6, 6); } 69.23% { filter: alpha(opacity=0); opacity: 0; transform: scale(6, 6); } } @keyframes w11 { from { filter: alpha(opacity=0); opacity: 0; transform: scale(6, 6); } 69.23% { filter: alpha(opacity=0); opacity: 0; transform: scale(6, 6); } } .w11 { animation: 'w11' 1.6s ease-in-out 0s normal; -ms-animation: w11 1.6s ease-in-out 0s normal; -moz-animation: w11 1.6s ease-in-out 0s normal; -o-animation: 'w11' 1.6s ease-in-out 0s normal; -webkit-animation: 'w11' 1.6s ease-in-out 0s normal; } body { background-color: #fff } .videolist { position: relative; float: left; margin-left: 60px; margin-bottom: 60px; } .videolist:hover { cursor: pointer; } .videoed { display: none; width: 50px; height: 50px; position: absolute; left: 45%; top: 45%; z-index: 99; border-radius: 100%; } .videos { display: none; /* border: 1px solid #080808; */ position: fixed; left: 50%; top: 50%; margin-left: -640px; margin-top: -360px; z-index: 100; width: 1280px; height: 720px; background: #1f202b; } .vclose { position: absolute; right: 1%; top: 1%; border-radius: 100%; cursor: pointer; } /* video */ video:focus { outline: -webkit-focus-ring-color auto 0px; } .videolist .img1 { position: relative; /* top: -5px; */ height: 365px; } .shadow { box-shadow: 10px 6px 8px #2a2b2f; width: 321px; height: 572px; } .videolist h5 { display: none; }