Commit 411ce25e40f6cdb05eaaf56855086e2b7cd2c0b3

Authored by zhiyangdu
1 parent a129be8f

样式优化

src/pages/index/index.less
... ... @@ -33,61 +33,61 @@
33 33 margin:22px 35px 0 35px;
34 34 }
35 35 }
36   - div:nth-child(3){
  36 + .video1_poster{
37 37 width: 100%;
38 38 height: 806px;
39 39 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568c9e73d.jpg") no-repeat center top;
40 40 background-size: 100%;
41 41 }
42   - div:nth-child(4){
  42 + .div4{
43 43 width: 100%;
44 44 height: 856px;
45 45 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568d33312.jpg") no-repeat center top;
46 46 background-size: 100%;
47 47 }
48   - div:nth-child(5){
  48 + .div5{
49 49 width: 100%;
50 50 height: 668px;
51 51 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568ccd863.jpg") no-repeat center top;
52 52 background-size: 100%;
53 53 }
54   - div:nth-child(6){
  54 + .div6{
55 55 width: 100%;
56 56 height: 800px;
57 57 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568d0a6e2.jpg") no-repeat center top;
58 58 background-size: 100%;
59 59 }
60   - div:nth-child(7){
  60 + .div7{
61 61 width: 100%;
62 62 height: 700px;
63 63 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568d84a69.jpg") no-repeat center top;
64 64 background-size: 100%;
65 65 }
66   - div:nth-child(8){
  66 + .div8{
67 67 width: 100%;
68 68 height: 800px;
69 69 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568d94ae0.jpg") no-repeat center top;
70 70 background-size: 100%;
71 71 }
72   - div:nth-child(9){
  72 + .div9{
73 73 width: 100%;
74 74 height: 674px;
75 75 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568db09da.jpg") no-repeat center top;
76 76 background-size: 100%;
77 77 }
78   - div:nth-child(10){
  78 + .div10{
79 79 width: 100%;
80 80 height: 724px;
81 81 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568e1552e.jpg") no-repeat center top;
82 82 background-size: 100%;
83 83 }
84   - div:nth-child(11){
  84 + .div11{
85 85 width: 100%;
86 86 height: 504px;
87 87 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568e89cc3.jpg") no-repeat center top;
88 88 background-size: 100%;
89 89 }
90   - div:nth-child(12){
  90 + .div12{
91 91 width: 100%;
92 92 height: 806px;
93 93 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568e4de21.jpg") no-repeat center top;
... ... @@ -100,31 +100,31 @@
100 100 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568e7d975.jpg") no-repeat center top;
101 101 background-size: 100%;
102 102 }
103   - div:nth-child(14){
  103 + .div14{
104 104 width: 100%;
105 105 height: 760px;
106 106 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568eb453d.jpg") no-repeat center top;
107 107 background-size: 100%;
108 108 }
109   - div:nth-child(15){
  109 + .div15{
110 110 width: 100%;
111 111 height: 526px;
112 112 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568f1f576.jpg") no-repeat center top;
113 113 background-size: 100%;
114 114 }
115   - div:nth-child(16){
  115 + .div16{
116 116 width: 100%;
117 117 height: 390px;
118 118 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568f42359.jpg") no-repeat center top;
119 119 background-size: 100%;
120 120 }
121   - div:nth-child(17){
  121 + .div17{
122 122 width: 100%;
123 123 height: 520px;
124 124 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568f6ca8f.jpg") no-repeat center top;
125 125 background-size: 100%;
126 126 }
127   - div:nth-child(18){
  127 + .div18{
128 128 width: 100%;
129 129 height: 520px;
130 130 background: #bd3325 url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e09568f87930.jpg") no-repeat center top;
... ... @@ -143,7 +143,7 @@
143 143 .vjs-poster{
144 144 width: 100%;
145 145 height:401px;
146   - background-image: url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e0956907e4d7.png") !important;
  146 + background-image: url("https://wjj.ys2.cnliveimg.com/769/shop/img/2019/12/30/5e0976240574e.png") !important;
147 147 background-size: 100%;
148 148 }
149 149 }
... ...
src/pages/index/index.vue
... ... @@ -23,23 +23,23 @@
23 23 </div>
24 24 </div>
25 25  
26   - <div></div>
  26 + <div class="div4"></div>
27 27  
28   - <div></div>
  28 + <div class="div5"></div>
29 29  
30   - <div></div>
  30 + <div class="div6"></div>
31 31  
32   - <div></div>
  32 + <div class="div7"></div>
33 33  
34   - <div></div>
  34 + <div class="div8"></div>
35 35  
36   - <div></div>
  36 + <div class="div9"></div>
37 37  
38   - <div></div>
  38 + <div class="div10"></div>
39 39  
40   - <div></div>
  40 + <div class="div11"></div>
41 41 <!--视频-->
42   - <div class="video2_poster">
  42 + <div class="div12 video2_poster">
43 43 <div class="video_box">
44 44 <video-player class="video-player vjs-custom-skin" @play="onPlayerPlay($event)"
45 45 ref="videoPlayer"
... ... @@ -50,17 +50,17 @@
50 50 </video-player>
51 51 </div>
52 52 </div>
53   - <div></div>
  53 + <div class="div13"></div>
54 54  
55   - <div></div>
  55 + <div class="div14"></div>
56 56  
57   - <div></div>
  57 + <div class="div15"></div>
58 58  
59   - <div></div>
  59 + <div class="div16"></div>
60 60  
61   - <div></div>
  61 + <div class="div17"></div>
62 62  
63   - <div></div>
  63 + <div class="div18"></div>
64 64  
65 65 </div>
66 66 </div>
... ...