-
Notifications
You must be signed in to change notification settings - Fork 27
/
Copy pathindex.html
executable file
·197 lines (160 loc) · 7.49 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>
FrozenUI · 专注于移动web的UI框架，基于腾讯手机QQ规范.
</title>
<!-- Meta -->
<meta name="description" content="专注于移动web的UI框架，基于腾讯手机QQ规范.">
<meta name="author" content="Tencent.com">
<!-- Bootstrap core CSS -->
<link href="/dist/css/bootstrap.css" rel="stylesheet">
<link href="/dist/css/full.css" rel="stylesheet">
<!-- Documentation extras -->
<link href="/assets/css/docs.css" rel="stylesheet">
<!-- Favicons -->
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="icon" href="/favicon.ico">
<script>
var _mtac = {"senseQuery":1};
(function() {
var mta = document.createElement("script");
mta.src = "http://pingjs.qq.com/h5/stats.js?v2.0.2";
mta.setAttribute("name", "MTAH5");
mta.setAttribute("sid", "500500200");
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(mta, s);
})();
</script>
</head>
<body class="bd-home">
<header class="navbar navbar-expand-md bd-navbar">
<nav class="container">
<div class="d-flex justify-content-between">
<a class="navbar-brand logo-frozenui" href="/">
FrozenUI
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#bd-main-nav" aria-controls="bd-main-nav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="bd-main-nav">
<ul class="nav navbar-nav">
<li class="nav-item active">
<a class="nav-item nav-link active" href="/">首页</a>
</li>
<li class="nav-item">
<a class="nav-item nav-link " href="/getting-started">快速开始</a>
</li>
<li class="nav-item">
<a class="nav-item nav-link " href="/components/components">UI组件</a>
</li>
<li class="nav-item">
<a class="nav-item nav-link " href="/components/function">工具方法</a>
</li>
<li class="nav-item">
<a class="nav-item nav-link" target="_blank" href="http://ryanbay.cn/vipstyle/qui/2.0.0/demo/html/index.html">DEMO</a>
</li>
<li class="nav-item">
<a class="nav-item nav-link" target="_blank" href="http://frozenui.github.io/case.html">精彩H5</a>
</li>
<li class="nav-item">
<a class="nav-item nav-link" target="_blank" href="https://github.com/frozenui/frozenui">GitHub</a>
</li>
<li class="nav-item">
<a class="nav-item nav-link" target="_blank" href="http://dopro.io/">博客</a>
</li>
<li class="nav-item">
<a class="nav-item nav-link" target="_blank" href="https://play.qq.com">福利站</a>
</li>
<li class="nav-item">
<a class="nav-item nav-link" target="_blank" href="https://boodo.qq.com">波洞星球</a>
</li>
</ul>
</div>
</nav>
</header>
<main class="bd-masthead" id="content" role="main">
<div class="container">
<p class="logo-img"><img src="/assets/img/logo.png" width="100%" alt="frozenui"></p>
<p class="lead">FrozenUI 是一套基于移动端的UI库<br>轻量、精美、遵从手机 QQ 设计规范</p>
<p class="lead">
<a href="/getting-started" class="btn btn-lg btn-download" onclick="">开始使用</a>
<a href="https://github.com/frozenui/frozenui/archive/2.0.0.zip" class="btn btn-lg btn-download" onclick="">立即下载</a>
</p>
<p class="version">当前版本 v2.0.0</p>
</div>
</main>
<div class="bd-featurette">
<div class="container">
<h2 class="bd-featurette-title">简单易用，轻量快捷</h2>
<hr class="half-rule">
<div class="lead index-info">
<p>适用于使用手Q规范设计的Web页面，而针对非手Q规范的页面，可通过修改变量定制界面主题。</p>
<p>可以按需选择需要的组件，也可以采用cdn和combo的方式按需加载。</p>
<p>使用iconfont展示图标，包含了按钮，列表，表单，提示，弹窗等常用组件，新增文本，布局，1px，
rem，文字截断，占位，两端留白，两端对齐等解决方案，同时解决了<a target="_blank" href="https://github.com/frozenui/frozenui/wiki/%E5%B1%8F%E5%B9%95%E9%80%82%E9%85%8D">移动端屏幕适配</a>问题。</p>
<p>CSS使用模块化的样式命名和组织规范，使用sass编写css代码。</p>
<p>兼容android 2.3 +，ios 4.0 + 。
<p>
<a href="https://github.com/frozenui/frozenui" class="btn btn-bs btn-go-github">查看 GitHub 项目主页</a>
</p>
</div>
</div>
</div>
<!-- <div class="bd-featurette">
<div class="container">
<h2 class="bd-featurette-title"></h2>
<p class="lead"></p>
<div class="row" style="text-align: center">
<div class="col-sm-4 mb-3">
<img src="/assets/img/pic1.png" alt="" class="img-fluid figure">
<h4>随心所用的样式组件</h4>
<p>FrozenUI 提供的CSS组件是目前QQ会员前端开发组所用的通用样式库。遵循手Q样式规范，基本样式使用离线包的方式减少请求，并提供快速接入的方案。</p>
</div>
<div class="col-sm-4 mb-3">
<img src="/assets/img/pic2.png" alt="" class="img-fluid figure">
<h4>更显灵动的JS插件</h4>
<p>FrozenUI提供的一系列JavaScript插件，更优雅地在移动端上呈现更灵动的动画效果。</p>
</div>
<div class="col-sm-4 mb-3">
<img src="/assets/img/pic3.png" alt="" class="img-fluid figure">
<h4>酷炫好玩的案例秀</h4>
<p>FrozenUI提供的Animation case，把业务上有趣好玩的案例沉淀下来，帮助日后能更快速找到设计灵感。</p>
</div>
</div>
</div>
</div> -->
<footer class="bd-footer text-muted">
<div class="container">
<ul class="bd-footer-links">
<li><a href="https://github.com/frozenui/frozenui">GitHub</a></li>
<li><a href="http://ryanbay.cn/vipstyle/qui/2.0.0/demo/html/index.html">DEMO</a></li>
<li><a href="http://frozenui.github.io/case.html">精彩H5</a></li>
<li><a target="_blank" href="https://cloudbase.net/?from=10003">云开发CloudBase</a></li>
<li><a href="tencent://message/?Menu=yes&uin=427632094">QQ群：427632094</a></li>
</ul>
<p></p>
<p>©2020 Deep Ocean Team</p>
<img src="./assets/img/dopro.png" class="qrcode">
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
<script src="/assets/js/vendor/tether.min.js"></script>
<script src="/dist/js/bootstrap.js"></script>
<script src="/dist/js/qrcode.min.js"></script>
<script src="/dist/js/index.js"></script>
<script src="/assets/js/vendor/anchor.min.js"></script>
<script src="/assets/js/vendor/clipboard.min.js"></script>
<script src="/assets/js/vendor/holder.min.js"></script>
<script src="/assets/js/src/application.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="/assets/js/ie10-viewport-bug-workaround.js"></script>
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
<script>
</script>
</body>
</html>