WeChat UI 设计
来自Jack's Lab
（版本间的差异）
(→Quick Start) |
(→Quick Start) |
||
| 第31行： | 第31行： | ||
<title>WeUI</title> | <title>WeUI</title> | ||
<!-- 引入 WeUI --> | <!-- 引入 WeUI --> | ||
| − | <link rel="stylesheet" href=" | + | <link rel="stylesheet" href="http://res.wx.qq.com/open/libs/weui/0.4.0/weui.min.css"/> |
</head> | </head> | ||
<body> | <body> | ||
2016年3月1日 (二) 11:36的版本
1 概述
微信官方开源了 WeUI ，其是一套与微信原生 UI 一致的 UI 库，核心文件是 weui.css，只需要获取到该文件，然后在页面中引入，即可使用 WeUI 的组件。有以下几种获取方式：
- 微信官方 http://res.wx.qq.com/open/libs/weui/0.4.0/weui.css
- BootCDN http://cdn.bootcss.com/weui/0.4.0/style/weui.css
- cdnjs http://cdnjs.cloudflare.com/ajax/libs/weui/0.4.0/style/weui.css
其中，0.4.0 是目前 WeUI 最新的版本号，其他版本同理。
以上链接，均支持 http 和 https 协议，均包含未压缩版 weui.css 和压缩版 weui.min.css
WeUI 的源码在： https://github.com/weui/weui
WeUI 页面示例：
2 Quick Start
<html lang="en">
<head>
<meta charset="UTF-8">
<title>WeUI</title>
<!-- 引入 WeUI -->
<link rel="stylesheet" href="http://res.wx.qq.com/open/libs/weui/0.4.0/weui.min.css"/>
</head>
<body>
<!-- 使用 -->
<a href="javascript:;" class="weui_btn weui_btn_primary">绿色按钮</a>
</body>
</html>
