Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.
 
 
 
 
 
 

199 строки
3.5 KiB

  1. .swiper-container {
  2. width:100%;
  3. height:100%;
  4. margin:0 auto;
  5. position:relative;
  6. overflow:hidden;
  7. -webkit-backface-visibility:hidden;
  8. -moz-backface-visibility:hidden;
  9. -ms-backface-visibility:hidden;
  10. -o-backface-visibility:hidden;
  11. backface-visibility:hidden;
  12. /* Fix of Webkit flickering */
  13. z-index:1;
  14. }
  15. .swiper-wrapper {
  16. position:relative;
  17. width:100%;
  18. height:100%;
  19. -webkit-transition-property:-webkit-transform, left, top;
  20. -webkit-transition-duration:0s;
  21. -webkit-transform:translate3d(0px,0,0);
  22. -webkit-transition-timing-function:ease;
  23. -moz-transition-property:-moz-transform, left, top;
  24. -moz-transition-duration:0s;
  25. -moz-transform:translate3d(0px,0,0);
  26. -moz-transition-timing-function:ease;
  27. -o-transition-property:-o-transform, left, top;
  28. -o-transition-duration:0s;
  29. -o-transform:translate3d(0px,0,0);
  30. -o-transition-timing-function:ease;
  31. -o-transform:translate(0px,0px);
  32. -ms-transition-property:-ms-transform, left, top;
  33. -ms-transition-duration:0s;
  34. -ms-transform:translate3d(0px,0,0);
  35. -ms-transition-timing-function:ease;
  36. transition-property:transform, left, top;
  37. transition-duration:0s;
  38. transform:translate3d(0px,0,0);
  39. transition-timing-function:ease;
  40. -webkit-box-sizing: content-box;
  41. -moz-box-sizing: content-box;
  42. box-sizing: content-box;
  43. }
  44. .swiper-free-mode > .swiper-wrapper {
  45. -webkit-transition-timing-function: ease-out;
  46. -moz-transition-timing-function: ease-out;
  47. -ms-transition-timing-function: ease-out;
  48. -o-transition-timing-function: ease-out;
  49. transition-timing-function: ease-out;
  50. margin: 0 auto;
  51. }
  52. .swiper-slide {
  53. width:100%;
  54. height:100%;
  55. float: left;
  56. -webkit-box-sizing: content-box;
  57. -moz-box-sizing: content-box;
  58. box-sizing: content-box;
  59. }
  60. /* IE10 Windows Phone 8 Fixes */
  61. .swiper-wp8-horizontal {
  62. -ms-touch-action: pan-y;
  63. }
  64. .swiper-wp8-vertical {
  65. -ms-touch-action: pan-x;
  66. }
  67. /* ===============================================================
  68. Your custom styles, here you need to specify container's and slide's
  69. sizes, pagination, etc.
  70. ================================================================*/
  71. .swiper-container {
  72. /* Specify Swiper's Size: */
  73. /*width:200px;
  74. height: 100px;*/
  75. }
  76. .swiper-slide {
  77. /* Specify Slides's Size: */
  78. /*width: 100%;
  79. height: 100%;*/
  80. }
  81. .swiper-slide-active {
  82. /* Specific active slide styling: */
  83. }
  84. .swiper-slide-visible {
  85. /* Specific visible slide styling: */
  86. }
  87. /* ===============================================================
  88. Pagination Styles
  89. ================================================================*/
  90. .swiper-pagination {
  91. position: absolute;
  92. left: 0;
  93. text-align: center;
  94. bottom:30px;
  95. width: 100%;
  96. }
  97. /*基本点的样式*/
  98. .swiper-pagination-switch {
  99. display: inline-block;
  100. width: 12px;
  101. height: 12px;
  102. border-radius: 10px;
  103. background: #999;
  104. margin: 0 6px;
  105. cursor: pointer;
  106. }
  107. .swiper-active-switch {
  108. background: #fff;
  109. }
  110. .swiper-visible-switch {
  111. /* Specific visible button style: */
  112. }
  113. /*箭头的样式*/
  114. .arrow-left {
  115. width: 17px;
  116. height: 30px;
  117. position:absolute;
  118. z-index:1;
  119. top:50%;
  120. left:10px;
  121. text-decoration:none;
  122. color:#fff
  123. }
  124. .arrow-right {
  125. width: 17px;
  126. height: 30px;
  127. position:absolute;
  128. z-index:1;
  129. top:50%;
  130. right:10px;
  131. text-decoration:none;
  132. color:#fff
  133. }
  134. /*可以增加箭头:如下*/
  135. /*增加*/
  136. .arrow-left2 {
  137. width: 17px;
  138. height: 30px;
  139. position:absolute;
  140. z-index:1;
  141. top:50%;
  142. left:10px;
  143. text-decoration:none;
  144. color:#fff
  145. }
  146. .arrow-right2 {
  147. width: 17px;
  148. height: 30px;
  149. position:absolute;
  150. z-index:1;
  151. top:50%;
  152. right:10px;
  153. text-decoration:none;
  154. color:#fff
  155. }
  156. /*增加*/