fix:add GenerateParentheses

Author: AbsenceSliet

imgs/banner_g1.png

@@ -0,0 +1,172 @@
+ .swiper-container {
+   width: 100%;
+   background: #fff;
+   padding-bottom: 10px;
+   position: relative;
+ }
+
+ .swiper-navigator {
+   width: 90%;
+   height: 30px;
+   position: absolute;
+   -ms-transform: translate(-50%, -50%);
+   transform: translate(-50%, -50%);
+   top: 50%;
+   left: 50%;
+ }
+
+ .swiper-btn-next,
+ .swiper-btn-prev {
+   color: #fff;
+   background: rgba(0, 0, 0, .5);
+   position: absolute;
+   width: 30px;
+   height: 30px;
+   -ms-display: flex;
+   display: flex;
+   padding-top: 3px;
+   -ms-justify-content: center;
+   justify-content: center;
+   cursor: pointer;
+ }
+
+ .swiper-btn-next {
+   right: -40px;
+ }
+
+ .swiper-btn-prev {
+   left: -40px;
+ }
+
+ .swiper-wrap {
+   width: 90%;
+   margin: 0 auto;
+   /* 父元素开启3d，才会有叠加效果 f*/
+   -ms-transform-style: preserve-3d;
+   transform-style: preserve-3d;
+   /* 叠加过渡好看点 */
+   -ms-perspective: 500px;
+   perspective: 500px;
+   display: flex;
+   -ms-display: flex;
+   justify-content: center;
+   -ms-justify-content: center;
+   align-items: center;
+   -ms-align-items: center;
+   z-index: 9;
+   position: relative;
+ }
+
+ .swiper-wrap li {
+   position: absolute;
+   left: 0;
+   height: auto;
+   box-shadow: 0 0 11px rgba(0, 0, 0, 0.5);
+   border-radius: 6%;
+   width: auto;
+   top: 0;
+ }
+
+ .swiper-wrap li:nth-child(1) {
+   position: relative;
+ }
+
+ .swiper-wrap.transition li {
+   transition: .5s;
+ }
+
+ .swiper-wrap img {
+   width: 100%;
+   display: block;
+ }
+
+ .p1 {
+   z-index: 3;
+   transform: translateZ(100px) scale(0.5);
+   -ms-transform: translateZ(100px) scale(0.5);
+   /* transform: transalteZ(10px) 数值越大越上面*/
+ }
+
+ .p2 {
+   z-index: 2;
+   transform: translate3d(15%, 0, 90px) scale(0.4);
+   -ms-transform: translate3d(15%, 0, 90px) scale(0.4);
+ }
+
+ .swiper-3 .p3,
+ .swiper-6 .p6 {
+   z-index: 2;
+   transform: translate3d(-15%, 0, 90px) scale(.4);
+   -ms-transform: translate3d(-15%, 0, 90px) scale(.4);
+ }
+
+ .swiper-6 .p3,
+ .swiper-5 .p3 {
+   z-index: 1;
+   transform: translate3d(26%, 0, 80px) scale(.3);
+   -ms-transform: translate3d(26%, 0, 80px) scale(.3);
+ }
+
+ .swiper-6 .p4,
+ .swiper-4 .p3 {
+   transform: translate3d(0%, 0, 80px) scale(.3);
+   -ms-transform: translate3d(0%, 0, 80px) scale(.3);
+ }
+
+ .swiper-6 .p5,
+ .swiper-5 .p4 {
+   z-index: 1;
+   transform: translate3d(-26%, 0, 80px) scale(0.3);
+   -ms-transform: translate3d(-26%, 0, 80px) scale(0.3);
+ }
+
+ .swiper-6 .p6,
+ .swiper-4 .p4,
+ .swiper-5 .p5 {
+   z-index: 2;
+   transform: translate3d(-15%, 0, 90px) scale(.4);
+   -ms-transform: translate3d(-15%, 0, 90px) scale(.4);
+ }
+
+ .swiper-dots {
+   position: absolute;
+   left: 50%;
+   transform: translateX(-50%);
+   -ms-transform: translateX(-50%);
+   bottom: 11%;
+   display: flex;
+   justify-content: center;
+ }
+
+ .swiper-dots li {
+   width: 20px;
+   height: 2px;
+   background: #b5b5b5;
+   margin-right: 10px;
+   float: left;
+   transition: .3s;
+ }
+
+ .swiper-dots li:last-child {
+   margin: 0;
+ }
+
+ .swiper-dots .active {
+   background: #ff4949;
+ }
+
+ @media screen and (min-width: 425px) {
+
+   .swiper-wrap,
+   .swiper-navigator {
+     width: 80%;
+   }
+ }
+
+ @media screen and (min-width: 1360px) {
+
+   .swiper-wrap,
+   .swiper-navigator {
+     width: 1087px;
+   }
+ }