微信小程序开发之微信组件weui的使用流程
weui,可以认为一个框架,和bootstrap差不多
开发文档:http://old.jqweui.com/components
github js文档: https://github.com/Tencent/weui.js
菜鸟教程:http://www.runoob.com/w3cnote/weui-for-weixin-web.html
效果展示: https://weui.io
下载链接(相当于bootstrap安装包): https://github.com/weui/weui-wxss/
这里简单介绍一下小程序如何引入weui及其简单的使用
weui的使用
样式链接导入
1 . 使用微信官方链接
<link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/0.4.3/weui.min.css">
2.使用Staticfile CDN的链接
<link rel="stylesheet" href="https://cdn.staticfile.org/weui/0.4.3/style/weui.css">
3.使用cdnjs的链接
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/weui/0.4.3/style/weui.css">
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
<title>WeUI</title>
<!-- 引入 WeUI ,相当于bootstrap的css文件,引入后即可设置样式-->
<!-- 网上找到的连接 -->
<!-- <link rel="stylesheet" href="http://res.wx.qq.com/open/libs/weui/0.4.0/weui.min.css"> -->
<!-- 使用微信官方链接 -->
<!-- <link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/0.4.3/weui.min.css"> -->
<!-- 使用Staticfile CDN的链接 -->
<!-- <link rel="stylesheet" href="https://cdn.staticfile.org/weui/0.4.3/style/weui.css"> -->
<!-- 使用cdnjs的链接 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/weui/0.4.3/style/weui.css">
<script src="https://cdn.bootcss.com/jquery-weui/1.2.1/js/city-picker.js"></script>
</head>
<body ontouchstart>
<!-- 使用 WeUI -->
<a href="" class="weui_btn weui_btn_primary">绿色按钮</a>
<div class="weui_cells_title">带图标、说明、跳转的列表项</div>
</body>
</html>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· DeepSeek 开源周回顾「GitHub 热点速览」
· 记一次.NET内存居高不下排查解决与启示
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· .NET10 - 预览版1新功能体验(一)