|
@@ -0,0 +1,455 @@
|
|
|
+/*主要样式*/
|
|
|
+.centerDiv{
|
|
|
+ position: absolute;
|
|
|
+ width: 39%;
|
|
|
+ height: 700px;
|
|
|
+ left: 29%;
|
|
|
+ top: 0;
|
|
|
+ z-index: 9999!important;
|
|
|
+}
|
|
|
+.topDiv{
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ height: 300px;
|
|
|
+ left: 50px;
|
|
|
+ top: 30px;
|
|
|
+ z-index: 9999!important;
|
|
|
+}
|
|
|
+.bottomDiv{
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ height: 300px;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ z-index: 9999!important;
|
|
|
+}
|
|
|
+
|
|
|
+.leftOneDiv{
|
|
|
+ position: absolute;
|
|
|
+ left: 83px;
|
|
|
+ top: 55px;
|
|
|
+ background:url(../img/yining/leftOne.png) no-repeat center fixed;
|
|
|
+ transform: scale(0.5);
|
|
|
+ height: 296px;
|
|
|
+ width: 750px;
|
|
|
+ font-size: 50px;
|
|
|
+ color:rgb(209,231,250);
|
|
|
+}
|
|
|
+
|
|
|
+.leftOneTopLine{
|
|
|
+ position: absolute;
|
|
|
+ top: 0px;
|
|
|
+ left: 200px;
|
|
|
+ background:url(../img/yining/leftOneTopLine.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.4);
|
|
|
+ height: 6px;
|
|
|
+ width: 450px;
|
|
|
+}
|
|
|
+.leftOneBottomLine{
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0px;
|
|
|
+ left: 14px;
|
|
|
+ background:url(../img/yining/leftOneBottomLine.png) no-repeat center fixed;
|
|
|
+ transform: scale(1);
|
|
|
+ height: 6px;
|
|
|
+ width: 606px;
|
|
|
+}
|
|
|
+
|
|
|
+.leftTwoDiv{
|
|
|
+ position: absolute;
|
|
|
+ left: 100px;
|
|
|
+ top: 200px;
|
|
|
+ background:url(../img/yining/leftTwo.png) no-repeat center fixed;
|
|
|
+ transform: scale(0.5);
|
|
|
+ height: 296px;
|
|
|
+ width: 627px;
|
|
|
+ font-size: 50px;
|
|
|
+ color:rgb(209,231,250);
|
|
|
+}
|
|
|
+.leftTwoTopLine{
|
|
|
+ position: absolute;
|
|
|
+ top: 0px;
|
|
|
+ left: 10px;
|
|
|
+ background:url(../img/yining/leftTwoTopLine.png) no-repeat center fixed;
|
|
|
+ transform: scale(1);
|
|
|
+ height: 6px;
|
|
|
+ width: 606px;
|
|
|
+}
|
|
|
+.leftTwoBottomLine{
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0px;
|
|
|
+ left: 22px;
|
|
|
+ background:url(../img/yining/leftTwoBottomLine.png) no-repeat center fixed;
|
|
|
+ transform: scale(1);
|
|
|
+ height: 6px;
|
|
|
+ width: 606px;
|
|
|
+}
|
|
|
+
|
|
|
+.leftThreeDiv{
|
|
|
+ position: absolute;
|
|
|
+ left: 65px;
|
|
|
+ top: 344px;
|
|
|
+ background:url(../img/yining/leftThree.png) no-repeat center fixed;
|
|
|
+ transform: scale(0.5);
|
|
|
+ height: 296px;
|
|
|
+ width: 750px;
|
|
|
+ font-size: 50px;
|
|
|
+ color:rgb(209,231,250);
|
|
|
+}
|
|
|
+.leftThreeTopLine{
|
|
|
+ position: absolute;
|
|
|
+ top: 0px;
|
|
|
+ left: 10px;
|
|
|
+ background:url(../img/yining/leftThreeTopLine.png) no-repeat center fixed;
|
|
|
+ transform: scale(1);
|
|
|
+ height: 6px;
|
|
|
+ width: 606px;
|
|
|
+}
|
|
|
+.leftThreeBottomLine{
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0px;
|
|
|
+ left: 215px;
|
|
|
+ background:url(../img/yining/leftThreeBottomLine.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.4);
|
|
|
+ height: 6px;
|
|
|
+ width: 450px;
|
|
|
+}
|
|
|
+
|
|
|
+.rightOneDiv{
|
|
|
+ position: absolute;
|
|
|
+ right: 140px;
|
|
|
+ top: 55px;
|
|
|
+ background:url(../img/yining/rightOne.png) no-repeat center fixed;
|
|
|
+ transform: scale(0.5);
|
|
|
+ height: 296px;
|
|
|
+ width: 750px;
|
|
|
+ font-size: 50px;
|
|
|
+ color:rgb(209,231,250);
|
|
|
+}
|
|
|
+.rightOneTopLine{
|
|
|
+ position: absolute;
|
|
|
+ top: 0px;
|
|
|
+ right: 200px;
|
|
|
+ background:url(../img/yining/rightOneTopLine.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.4);
|
|
|
+ height: 6px;
|
|
|
+ width: 450px;
|
|
|
+}
|
|
|
+.rightOneBottomLine{
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0px;
|
|
|
+ right: 14px;
|
|
|
+ background:url(../img/yining/rightOneBottomLine.png) no-repeat center fixed;
|
|
|
+ transform: scale(1);
|
|
|
+ height: 6px;
|
|
|
+ width: 606px;
|
|
|
+}
|
|
|
+
|
|
|
+.rightTwoDiv{
|
|
|
+ position: absolute;
|
|
|
+ right: 155px;
|
|
|
+ top: 200px;
|
|
|
+ background:url(../img/yining/rightTwo.png) no-repeat center fixed;
|
|
|
+ transform: scale(0.5);
|
|
|
+ height: 296px;
|
|
|
+ width: 627px;
|
|
|
+ font-size: 50px;
|
|
|
+ color:rgb(209,231,250);
|
|
|
+}
|
|
|
+.rightTwoTopLine{
|
|
|
+ position: absolute;
|
|
|
+ top: 0px;
|
|
|
+ right: 10px;
|
|
|
+ background:url(../img/yining/rightTwoTopLine.png) no-repeat center fixed;
|
|
|
+ transform: scale(1);
|
|
|
+ height: 6px;
|
|
|
+ width: 606px;
|
|
|
+}
|
|
|
+.rightTwoBottomLine{
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0px;
|
|
|
+ right: 22px;
|
|
|
+ background:url(../img/yining/rightTwoBottomLine.png) no-repeat center fixed;
|
|
|
+ transform: scale(1);
|
|
|
+ height: 6px;
|
|
|
+ width: 606px;
|
|
|
+}
|
|
|
+
|
|
|
+.rightThreeDiv{
|
|
|
+ position: absolute;
|
|
|
+ right: 122px;
|
|
|
+ top: 344px;
|
|
|
+ background:url(../img/yining/rightThree.png) no-repeat center fixed;
|
|
|
+ transform: scale(0.5);
|
|
|
+ height: 296px;
|
|
|
+ width: 750px;
|
|
|
+ font-size: 50px;
|
|
|
+ color:rgb(209,231,250);
|
|
|
+}
|
|
|
+.rightThreeTopLine{
|
|
|
+ position: absolute;
|
|
|
+ top: 0px;
|
|
|
+ right: 10px;
|
|
|
+ background:url(../img/yining/rightThreeTopLine.png) no-repeat center fixed;
|
|
|
+ transform: scale(1);
|
|
|
+ height: 6px;
|
|
|
+ width: 606px;
|
|
|
+}
|
|
|
+.rightThreeBottomLine{
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0px;
|
|
|
+ right: 215px;
|
|
|
+ background:url(../img/yining/rightThreeBottomLine.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.4);
|
|
|
+ height: 6px;
|
|
|
+ width: 450px;
|
|
|
+}
|
|
|
+
|
|
|
+.leftOneDiv:hover{
|
|
|
+ background:url(../img/yining/hover/leftOneHover.png) no-repeat center fixed;
|
|
|
+ color:rgb(0,251,255);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+.leftOneDiv:hover .leftOneIcon{
|
|
|
+ content:url(../img/jiangjin/左一.png)
|
|
|
+}
|
|
|
+.leftOneDiv:hover .leftOneTopLine{
|
|
|
+ background:url(../img/yining/分割线高亮.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.5);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+.leftOneDiv:hover .leftOneBottomLine{
|
|
|
+ background:url(../img/yining/分割线高亮.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.1);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+
|
|
|
+.leftTwoDiv:hover{
|
|
|
+ background:url(../img/yining/hover/leftTwoHover.png) no-repeat center fixed;
|
|
|
+ color:rgb(0,251,255);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+.leftTwoDiv:hover .leftTwoIcon{
|
|
|
+ content:url(../img/jiangjin/左二.png)
|
|
|
+}
|
|
|
+.leftTwoDiv:hover .leftTwoTopLine{
|
|
|
+ background:url(../img/yining/分割线高亮.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.2);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+.leftTwoDiv:hover .leftTwoBottomLine{
|
|
|
+ background:url(../img/yining/分割线高亮.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.1);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+
|
|
|
+.leftThreeDiv:hover{
|
|
|
+ background:url(../img/yining/hover/leftThreeHover.png) no-repeat center fixed;
|
|
|
+ color:rgb(0,251,255);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+.leftThreeDiv:hover .leftThreeIcon{
|
|
|
+ content:url(../img/jiangjin/左三.png)
|
|
|
+}
|
|
|
+.leftThreeDiv:hover .leftThreeTopLine{
|
|
|
+ background:url(../img/yining/分割线高亮.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.1);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+.leftThreeDiv:hover .leftThreeBottomLine{
|
|
|
+ background:url(../img/yining/分割线高亮.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.3);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+
|
|
|
+.rightOneDiv:hover{
|
|
|
+ background:url(../img/yining/hover/rightOneHover.png) no-repeat center fixed;
|
|
|
+ color:rgb(0,251,255);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+.rightOneDiv:hover .rightOneIcon{
|
|
|
+ content:url(../img/jiangjin/右一.png)
|
|
|
+}
|
|
|
+.rightOneDiv:hover .rightOneTopLine{
|
|
|
+ background:url(../img/yining/分割线高亮rotated.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.4);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+.rightOneDiv:hover .rightOneBottomLine{
|
|
|
+ background:url(../img/yining/分割线高亮rotated.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.1);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+
|
|
|
+.rightTwoDiv:hover{
|
|
|
+ background:url(../img/yining/hover/rightTwoHover.png) no-repeat center fixed;
|
|
|
+ color:rgb(0,251,255);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+.rightTwoDiv:hover .rightTwoIcon{
|
|
|
+ content:url(../img/jiangjin/右二.png)
|
|
|
+}
|
|
|
+.rightTwoDiv:hover .rightTwoTopLine{
|
|
|
+ background:url(../img/yining/分割线高亮rotated.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.2);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+.rightTwoDiv:hover .rightTwoBottomLine{
|
|
|
+ background:url(../img/yining/分割线高亮rotated.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.1);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+
|
|
|
+.rightThreeDiv:hover{
|
|
|
+ background:url(../img/yining/hover/rightThreeHover.png) no-repeat center fixed;
|
|
|
+ color:rgb(0,251,255);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+.rightThreeDiv:hover .rightThreeIcon{
|
|
|
+ content:url(../img/jiangjin/右三.png)
|
|
|
+}
|
|
|
+.rightThreeDiv:hover .rightThreeTopLine{
|
|
|
+ background:url(../img/yining/分割线高亮rotated.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.1);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+.rightThreeDiv:hover .rightThreeBottomLine{
|
|
|
+ background:url(../img/yining/分割线高亮rotated.png) no-repeat center fixed;
|
|
|
+ transform: scale(1.3);
|
|
|
+ z-index: 99999;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+/* 其他样式 */
|
|
|
+.leftAllLine{
|
|
|
+ height: 1048px;
|
|
|
+ width: 91px;
|
|
|
+ transform: scale(0.5);
|
|
|
+ position: absolute;
|
|
|
+ left: 180px;
|
|
|
+ top: 35px;
|
|
|
+}
|
|
|
+.rightAllLine{
|
|
|
+ height: 1048px;
|
|
|
+ width: 91px;
|
|
|
+ transform: scale(0.5);
|
|
|
+ position: absolute;
|
|
|
+ right: 180px;
|
|
|
+ top: 35px;
|
|
|
+}
|
|
|
+
|
|
|
+.leftMenu{
|
|
|
+ background:url(../img/yining/二级菜单背景.png) no-repeat center fixed;
|
|
|
+ height: 1048px;
|
|
|
+ /*width: 424px;*/
|
|
|
+ width: 0;
|
|
|
+ transform: scale(0.5);
|
|
|
+ position: absolute;
|
|
|
+ /*left: -60px;*/
|
|
|
+ right: 81%;
|
|
|
+ top: 35px;
|
|
|
+ /*display: none;*/
|
|
|
+}
|
|
|
+.leftMenuMedLine{
|
|
|
+ background:url(../img/yining/背景弧小号.png) no-repeat center fixed;
|
|
|
+ height: 100%;
|
|
|
+ width: 87px;
|
|
|
+ position: absolute;
|
|
|
+ left: -40px;
|
|
|
+ top: -40px;
|
|
|
+}
|
|
|
+.leftMenuLeftLine{
|
|
|
+ background:url(../img/yining/背景弧中号.png) no-repeat center fixed;
|
|
|
+ height: 100%;
|
|
|
+ width: 91px;
|
|
|
+ position: absolute;
|
|
|
+ left: 0px;
|
|
|
+ top: -40px;
|
|
|
+}
|
|
|
+.leftMenuRightLine{
|
|
|
+ background:url(../img/yining/背景弧中号.png) no-repeat center fixed;
|
|
|
+ height: 100%;
|
|
|
+ width: 91px;
|
|
|
+ position: absolute;
|
|
|
+ right: 0px;
|
|
|
+ top: -40px;
|
|
|
+}
|
|
|
+
|
|
|
+.rightMenu{
|
|
|
+ background:url(../img/yining/二级菜单背景_rotated.png) no-repeat center fixed;
|
|
|
+ height: 1048px;
|
|
|
+ /*width: 424px;*/
|
|
|
+ width: 0;
|
|
|
+ transform: scale(0.5);
|
|
|
+ position: absolute;
|
|
|
+ /*right: -60px;*/
|
|
|
+ left: 81%;
|
|
|
+ top: 35px;
|
|
|
+ /*display: none;*/
|
|
|
+}
|
|
|
+.rightMenuMedLine{
|
|
|
+ background:url(../img/yining/背景弧小号_rotated.png) no-repeat center fixed;
|
|
|
+ height: 100%;
|
|
|
+ width: 87px;
|
|
|
+ position: absolute;
|
|
|
+ right: -40px;
|
|
|
+ top: -40px;
|
|
|
+}
|
|
|
+.rightMenuLeftLine{
|
|
|
+ background:url(../img/yining/背景弧中号_rotated.png) no-repeat center fixed;
|
|
|
+ height: 100%;
|
|
|
+ width: 91px;
|
|
|
+ position: absolute;
|
|
|
+ left: 0px;
|
|
|
+ top: -40px;
|
|
|
+}
|
|
|
+.rightMenuRightLine{
|
|
|
+ background:url(../img/yining/背景弧中号_rotated.png) no-repeat center fixed;
|
|
|
+ height: 100%;
|
|
|
+ width: 91px;
|
|
|
+ position: absolute;
|
|
|
+ right: 0px;
|
|
|
+ top: -40px;
|
|
|
+}
|
|
|
+
|
|
|
+.menuUl {
|
|
|
+ font-size: 40px;
|
|
|
+ color:rgb(209,231,250);
|
|
|
+ width: 100%;
|
|
|
+ height: 80%;
|
|
|
+ position: absolute;
|
|
|
+ left: -40px;
|
|
|
+ top: 70px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+.menuUlLi{
|
|
|
+ list-style: none;
|
|
|
+ margin: 0 auto;
|
|
|
+ padding: 10px;
|
|
|
+}
|
|
|
+.menuUlLi:hover{
|
|
|
+ color:rgb(0,251,255);
|
|
|
+}
|
|
|
+
|
|
|
+.menuUlRight{
|
|
|
+ font-size: 40px;
|
|
|
+ color:rgb(209,231,250);
|
|
|
+ width: 100%;
|
|
|
+ height: 80%;
|
|
|
+ position: absolute;
|
|
|
+ left: 10px;
|
|
|
+ top: 70px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+.menuUlLiRight{
|
|
|
+ list-style: none;
|
|
|
+ margin: 0 auto;
|
|
|
+ padding: 10px;
|
|
|
+}
|
|
|
+.menuUlLiRight:hover{
|
|
|
+ color:rgb(0,251,255);
|
|
|
+}
|