-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
337 lines (305 loc) · 20.1 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<!--
Apply head only for dev environment, this is required for jekyll to
insert livereload scripts
-->
<meta charset="utf-8">
<title>Mobike</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Define a description for better SEO result -->
<meta name="description" content="Mobike - 让自行车回归城市">
<!-- Cheome Web App theme color -->
<meta name="theme-color" content="#ff4612">
<!-- Feed URL -->
<!--<link rel="alternate" href="https://mobike.com/cn/feed/" type="application/rss+xml" title="Mobike Blog">-->
<!-- Site icons -->
<link rel="apple-touch-icon" href="/cn/apple-touch-icon.png">
<link rel="icon" href="images/favicon.png" type="image/png">
<link rel="shortcut icon" href="images/favicon.png" type="image/png">
<!-- Chrome Web App manifest -->
<!--<link rel="manifest" href="/cn/manifest.json">-->
<!-- Main CSS -->
<link rel="stylesheet" href="css/index.css">
<link rel="stylesheet" href="css/reset.min.css">
<!--swiper轮播图插件 CSS-->
<link rel="stylesheet" href="css/swiper.min.css">
<!-- Canonical links, avoid duplicate content problems -->
<!--<link rel="canonical" href="https://mobike.com/cn/">-->
<!-- DNS prefetching for static files -->
<!--<link rel="dns-prefetch" href="https://d349cztnlupsuf.cloudfront.net">-->
<!-- browser-sync, don't remove this -->
<!-- BS_INSERT -->
<!-- Head hooks -->
<!-- Open Graph and Twitter Cards support, more info: https://dev.twitter.com/docs/cards -->
<meta property="og:type" content="website">
<meta property="og:site_name" content="Mobike">
<meta property="og:title" content="Mobike">
<meta property="og:url" content="https://mobike.com/cn/">
<meta property="og:description" content="Mobike - 让自行车回归城市">
<meta property="og:image" content="https://mobike.com/cn/logo.png">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@sparanoid">
<meta name="twitter:creator" content="@tunghsiao">
<!-- body tag, closing tag located in footer.html -->
</head>
<body>
<section class="wrap">
<!--轮播图-->
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide" style="background-image: url('images/hero-bg-1.jpg')"></div>
<div class="swiper-slide" style="background-image: url('images/hero-bg-2.jpg')"></div>
<div class="swiper-slide" style="background-image: url('images/hero-bg-3.jpg')"></div>
<div class="swiper-slide" style="background-image: url('images/hero-bg-4.jpg')"></div>
<div class="swiper-slide" style="background-image: url('images/hero-bg-5.jpg')"></div>
<div class="swiper-slide" style="background-image: url('images/hero-bg-6.jpg')"></div>
<div class="swiper-slide" style="background-image: url('images/hero-bg-7.jpg')"></div>
<div class="swiper-slide" style="background-image: url('images/hero-bg-8.jpg')"></div>
</div>
<!-- 如果需要分页器 -->
<!--<div class="swiper-pagination"></div>-->
<!-- 如果需要导航按钮 -->
<!-- <div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>-->
<!-- 如果需要滚动条 不需要注释 -->
<!--<div class="swiper-scrollbar"></div>-->
</div>
<header class="header">
<section class="container_md">
<div class="logo">
<a class="" href="/cn/">
<svg width="100px" height="37px" viewBox="0 0 245 97" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 51.2 (57519) - http://www.bohemiancoding.com/sketch -->
<title>Artboard@1x</title>
<desc>Created with Sketch.</desc>
<defs>
<polygon id="path-1" points="0 96.9126 244.815 96.9126 244.815 -0.0004 0 -0.0004"></polygon>
</defs>
<g id="Artboard" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Group-19">
<path d="M79.9451,37.6161 C73.6651,37.6161 68.5551,32.5071 68.5551,26.2261 C68.5551,19.9461 73.6651,14.8371 79.9451,14.8371 C86.2251,14.8371 91.3351,19.9461 91.3351,26.2261 C91.3351,32.5071 86.2251,37.6161 79.9451,37.6161 M79.9451,6.4831 C69.0581,6.4831 60.2011,15.3401 60.2011,26.2261 C60.2011,37.1131 69.0581,45.9701 79.9451,45.9701 C90.8311,45.9701 99.6881,37.1131 99.6881,26.2261 C99.6881,15.3401 90.8311,6.4831 79.9451,6.4831" id="Fill-1" fill="#FFFFFF"></path>
<path d="M137.5623,26.2265 C137.5623,32.5065 132.4533,37.6165 126.1733,37.6165 C119.8923,37.6165 114.7833,32.5065 114.7833,26.2265 C114.7833,19.9465 119.8923,14.8365 126.1733,14.8365 C132.4533,14.8365 137.5623,19.9465 137.5623,26.2265 M126.1733,6.4835 C122.0403,6.4835 118.1273,7.7335 114.7833,10.1105 L114.7833,0.5885 L106.4303,0.5885 L106.4303,26.2265 C106.4303,37.1135 115.2863,45.9695 126.1733,45.9695 C137.0593,45.9695 145.9163,37.1135 145.9163,26.2265 C145.9163,15.3395 137.0593,6.4835 126.1733,6.4835" id="Fill-3" fill="#FFFFFF"></path>
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<g id="Clip-6"></g>
<polygon id="Fill-5" fill="#FFFFFF" mask="url(#mask-2)" points="154.177 44.7726 162.531 44.7726 162.531 14.9036 154.177 14.9036"></polygon>
<path d="M53.825,20.8524 C53.218,12.7494 46.456,6.4834 38.273,6.4834 C33.95,6.4834 29.848,8.2784 26.912,11.4304 C23.977,8.2784 19.874,6.4834 15.552,6.4834 C7.368,6.4834 0.637,12.7494 0.03,20.8524 L0,21.4374 L0,44.7724 L8.353,44.7724 L8.353,21.6974 L8.382,21.4814 C8.666,17.7554 11.816,14.8364 15.552,14.8364 C19.281,14.8364 22.426,17.7444 22.721,21.4594 L22.721,44.7724 L31.074,44.7724 L31.074,21.6964 L31.103,21.4814 C31.387,17.7554 34.537,14.8364 38.273,14.8364 C42.01,14.8364 45.159,17.7554 45.443,21.4814 L45.471,21.8554 L45.471,44.7724 L53.825,44.7724 L53.825,20.8524 Z" id="Fill-7" fill="#FFFFFF" mask="url(#mask-2)"></path>
<path d="M163.301,4.9472 C163.301,2.2152 161.086,0.0002 158.354,0.0002 C155.621,0.0002 153.406,2.2152 153.406,4.9472 C153.406,7.6792 155.621,9.8942 158.354,9.8942 C161.086,9.8942 163.301,7.6792 163.301,4.9472" id="Fill-8" fill="#FFFFFF" mask="url(#mask-2)"></path>
<polygon id="Fill-9" fill="#FFFFFF" mask="url(#mask-2)" points="203.3416 7.6816 193.5436 7.6816 181.1476 24.5846 180.5456 24.5846 180.5456 0.5886 172.1926 0.5886 172.1926 44.7726 180.5456 44.7726 180.5456 27.8826 181.1576 27.8826 193.5436 44.7726 203.3416 44.7726 189.7756 26.2266"></polygon>
<path d="M225.0662,14.4648 C230.0082,14.4648 234.1962,17.7608 235.7392,22.3488 L235.7392,23.1948 L214.4182,23.1948 L214.4182,22.2588 C215.9852,17.7178 220.1542,14.4648 225.0662,14.4648 Z M244.5832,29.2578 C244.7352,28.2698 244.8152,27.2578 244.8152,26.2268 C244.8152,15.3188 235.9732,6.4778 225.0662,6.4778 C214.1592,6.4778 205.3172,15.3188 205.3172,26.2268 C205.3172,37.1338 214.1592,45.9758 225.0662,45.9758 C232.8402,45.9758 239.5542,41.4778 242.7762,34.9478 L242.7762,33.9988 L234.3932,33.9988 C232.2472,36.4778 229.0692,38.0558 225.5072,38.0558 C220.3442,38.0558 215.9762,34.7488 214.4182,30.1658 L214.4182,29.2578 L244.5832,29.2578 Z" id="Fill-10" fill="#FFFFFF" mask="url(#mask-2)"></path>
<polygon id="Fill-11" fill="#FFFFFF" mask="url(#mask-2)" points="41.9207 72.2929 38.4397 72.2929 38.4397 71.0359 33.4037 71.0359 33.4037 72.2929 29.9217 72.2929 29.9217 74.6169 35.6327 74.6169 29.9217 76.7269 29.9217 78.8879 33.4037 77.6019 33.4037 79.5189 38.4397 79.5189 38.4397 77.6019 41.9207 78.8879 41.9207 76.7269 36.2097 74.6169 41.9207 74.6169"></polygon>
<polygon id="Fill-12" fill="#FFFFFF" mask="url(#mask-2)" points="55.3845 76.7265 49.6735 74.6175 55.3545 74.6175 55.3545 72.2925 51.8735 72.2925 51.8735 71.0365 46.8375 71.0365 46.8375 72.2925 43.3565 72.2925 43.3565 74.6175 49.0965 74.6175 43.3855 76.7265 43.3855 78.8875 46.8375 77.6135 46.8375 79.5185 51.8735 79.5185 51.8735 77.5905 55.3845 78.8875"></polygon>
<path d="M55.9534,66.1474 L44.0724,66.1474 L44.0724,65.7824 C44.0724,65.1594 43.5674,64.6534 42.9444,64.6534 L37.9214,64.6534 L37.9214,66.1474 L22.7604,66.1474 L22.7604,96.6884 L26.6754,96.6884 C27.2994,96.6884 27.8044,96.1824 27.8044,95.5594 L27.8044,69.5084 L55.9534,69.5084 L55.9534,66.1474 Z" id="Fill-13" fill="#FFFFFF" mask="url(#mask-2)"></path>
<polygon id="Fill-14" fill="#FFFFFF" mask="url(#mask-2)" points="111.4666 69.0917 111.4666 65.7307 95.7056 65.7307 95.7056 69.0917 101.0646 69.0917 101.0646 72.8517 95.7056 72.8517 95.7056 76.2117 101.0646 76.2117 101.0646 79.9717 95.7056 79.9717 95.7056 83.3317 101.0646 83.3317 101.0646 87.0917 95.7056 87.0917 95.7056 90.4527 101.0646 90.4527 101.0646 96.6887 106.1076 96.6887 106.1076 90.4527 111.4666 90.4527 111.4666 87.0917 106.1076 87.0917 106.1076 83.3317 111.4666 83.3317 111.4666 79.9717 106.1076 79.9717 106.1076 76.2117 111.4666 76.2117 111.4666 72.8517 106.1076 72.8517 106.1076 69.0917"></polygon>
<path d="M93.7654,68.0175 L93.7654,65.7855 L78.0724,65.7855 L78.0724,69.1465 L83.4304,69.1465 L83.4304,75.1495 L78.0724,75.1495 L78.0724,78.5105 L83.4304,78.5105 L83.4304,84.5145 L78.0724,84.5145 L78.0724,87.8745 L82.7824,87.8745 L79.4764,94.7575 L83.9634,96.9135 L88.3034,87.8745 L93.7654,87.8745 L93.7654,84.5145 L88.4074,84.5145 L88.4074,78.5105 L93.7654,78.5105 L93.7654,75.1495 L88.4074,75.1495 L88.4074,69.1465 L92.6374,69.1465 C93.2604,69.1465 93.7654,68.6405 93.7654,68.0175" id="Fill-15" fill="#FFFFFF" mask="url(#mask-2)"></path>
<path d="M55.3548,82.5761 L55.3548,81.3811 L29.9218,81.3811 L29.9218,83.7051 L40.7008,83.7051 L40.7008,85.9301 L29.9218,85.9301 L29.9218,88.2541 L40.7008,88.2541 L40.7008,90.4781 L29.9218,90.4781 L29.9218,92.8031 L40.7008,92.8031 L40.7008,94.9081 L35.2648,94.9081 L35.2648,96.7631 L44.6158,96.7631 C45.2388,96.7631 45.7448,96.2581 45.7448,95.6351 L45.7448,92.8031 L55.3548,92.8031 L55.3548,90.4781 L45.7448,90.4781 L45.7448,88.2541 L55.3548,88.2541 L55.3548,85.9301 L45.7448,85.9301 L45.7448,83.7051 L54.2268,83.7051 C54.8498,83.7051 55.3548,83.2001 55.3548,82.5761" id="Fill-16" fill="#FFFFFF" mask="url(#mask-2)"></path>
<path d="M139.739,79.9716 L147.51,79.9716 L147.51,76.6756 L139.739,76.6756 L139.739,79.9716 Z M139.738,73.3146 L147.509,73.3146 L147.509,69.5086 L139.738,69.5086 L139.738,73.3146 Z M152.553,73.3146 L160.449,73.3146 L160.449,69.5086 L152.553,69.5086 L152.553,73.3146 Z M152.553,79.9716 L160.449,79.9716 L160.449,76.6756 L152.553,76.6756 L152.553,79.9716 Z M166.223,87.0916 L152.553,87.0916 L152.553,83.3316 L165.493,83.3316 L165.493,66.1476 L161.179,66.1476 L161.179,64.5826 L156.215,64.5826 C155.592,64.5826 155.086,65.0886 155.086,65.7116 L155.086,66.1476 L144.976,66.1476 L144.976,65.7116 C144.976,65.0886 144.47,64.5826 143.847,64.5826 L138.883,64.5826 L138.883,66.1476 L134.695,66.1476 L134.695,83.3316 L147.509,83.3316 L147.509,87.0916 L133.965,87.0916 L133.965,90.4526 L147.509,90.4526 L147.509,96.6886 L152.553,96.6886 L152.553,90.4526 L166.223,90.4526 L166.223,87.0916 Z" id="Fill-17" fill="#FFFFFF" mask="url(#mask-2)"></path>
<polygon id="Fill-18" fill="#FFFFFF" mask="url(#mask-2)" points="221.4461 87.0917 208.9531 87.0917 208.9531 82.7137 220.7161 82.7137 220.7161 79.3537 208.9531 79.3537 208.9531 73.6777 203.9091 73.6777 203.9091 79.3537 195.2771 79.3537 198.6881 69.8387 220.7161 69.8387 220.7161 66.4787 199.8931 66.4787 200.5731 64.5827 195.2141 64.5827 194.5341 66.4787 189.9311 66.4787 189.9311 69.8387 193.3291 69.8387 189.9181 79.3537 189.9311 79.3537 189.9311 82.7137 203.9091 82.7137 203.9091 87.0917 189.1881 87.0917 189.1881 90.4527 203.9091 90.4527 203.9091 96.6887 208.9531 96.6887 208.9531 90.4527 221.4461 90.4527"></polygon></g></g></svg>
</a>
</div>
<div class="menu">
<a href="">产品</a>
<a href="">摩拜科技</a>
<a href="">关于</a>
<a href="">产品合作</a>
</div>
</section>
</header>
<section class="title">
<div class="container_md">
<h1 class="font-logo">让自行车回归城市</h1>
<a href="https://t.growingio.com/app/at0/KnoqExok" class="btn btn_hero btn_xl" style="box-shadow: rgba(122, 112, 101, 0.6) 0px 6px 30px 0px;">立即开始使用 Mobike</a>
</div>
</section>
<section class="news" style="background: rgba(74, 62, 62, 0.4);">
<div class="container_md">
<a href="/cn/news/468">
<span class="headline_icon">News</span>
<span class="headline-text">“摩拜公交” 小程序上线 线上购买地铁票省时省力</span>
</a>
</div>
</section>
</section>
<section class="hero_promos clearfix">
<div class="hero_promo">
<a href="" class="link" style="background-image: url('images/promo-01.jpg')"><h3>大国品牌</h3></a>
</div>
<div class="hero_promo">
<a href="" class="link" style="background-image: url('images/promo-02.jpg')"><h3>摩拜科技</h3></a>
</div>
<div class="hero_promo">
<a href="" class="link" style="background-image: url('images/promo-03.jpg')"><h3>摩拜生活</h3></a>
</div>
<div class="hero_promo" >
<a href="" class="link" style="background-image: url('images/promo-01.jpg')"><h3>摩拜校招</h3></a>
</div>
</section>
<section class="meta_links">
<div class="container_md clearfix">
<div class="meta_link">
<span class="icon" style="background-image: url('images/icon-wechat.png');">
</span>
<span class="text">
<h4>微信小程序</h4>
<p>微信扫一扫，直接用车</p>
</span>
</div>
<div class="meta_link" style="text-align: center">
<span class="icon" style="background-image: url('images/icon-rp.png');">
</span>
<span class="text">
<h4>红包车</h4>
<p>骑摩拜，能赚钱</p>
</span>
</div>
<div class="meta_link" style="text-align: right">
<span class="icon" style="background-image: url('images/icon-credit.png');">
</span>
<span class="text">
<h4>摩范分</h4>
<p>文明骑行，信用生活</p>
</span>
</div>
</div>
</section>
<footer class="footer">
<div class="footer_wrap">
<div class="container_md clearfix">
<div class="left">
<ul class="main-links">
<li><a href="/" class="font-logo" style="background-image: url('images/logo-text.svg')">Mobike</a></li>
<li>Beijing Mobike Technology Co., Ltd</li>
<li>客服电话 <a href="tel:400-811-7799">400-811-7799</a></li>
<li>北京摩拜科技有限公司</li>
</ul>
</div>
<div class="right">
<ul class="main_list clearfix">
<li class="product">
<h3>产品</h3>
<ul>
<li>
<a href="/cn/classic/">
经典版
</a>
</li>
<li>
<a href="/cn/lite/">
轻骑
</a>
</li>
<li>
<a href="/cn/lock/">
智能锁
</a>
</li>
</ul>
</li>
<li class="life">
<h3>生活</h3>
<ul>
<li>
<a href="/cn/cities/">
城市
</a>
</li>
</ul>
</li>
<li class="about">
<h3>关于</h3>
<ul>
<li>
<a href="/cn/about/">
关于 Mobike
</a>
</li>
<li>
<a href="http://www.hotjob.cn/wt/mobike/web/index">
加入我们
</a>
</li>
<li>
<a href="/cn/about/#contact">
联系我们
</a>
</li>
<li>
<a href="/cn/tos/">
服务协议
</a>
</li>
</ul>
</li>
<li class="social">
<h3>社交网络</h3>
<ul>
<li>
<a href="http://weibo.com/6038290538">
微博
</a>
</li>
<li>
<a class="wechat tooltip-light tooltipstered">
微信
</a>
</li>
<li>
<a href="https://www.zhihu.com/org/mo-bai-dan-che-1/answers">
知乎专栏
</a>
</li>
<li>
<a href="https://www.facebook.com/mobikeuk">
Facebook
</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
<div class="footer_miscs">
<div class="container_md clearfix">
<div class="copy">
<p>京 ICP 备15053449 号 <i class="beian_icon" style="background-image: url('images/beian-icon.png')"></i> 京公网安备 11010502032956 号</p>
<p>增值电信业务经营许可证编号：京B2-20170053</p>
</div>
<div class="sincerity">
<img src="images/footer-chengxin.jpg" width="40" height="40">
</div>
</div>
</div>
</footer>
</body>
<!--swiper js-->
<script type="text/javascript" src="js/swiper.min.js"></script>
<script type="text/javascript">
// swiper 配置
var mySwiper = new Swiper ('.swiper-container', {
//direction: 'vertical', // 垂直切换选项
loop: true, // 循环模式选项
autoplay: {
delay: 5000,
stopOnLastSlide: false,
disableOnInteraction: true,
},
// 如果需要分页器
pagination: {
el: '.swiper-pagination',
},
// 如果需要前进后退按钮
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
// 如果需要滚动条
scrollbar: {
el: '.swiper-scrollbar',
},
})
</script>
</html>