javaweb开发微信公众号项目中怎么使用WEUI

前言

使用java对微信公众号进行代码开发,关于前端实现则使用微信开发好的WEUI样式框架,那么具体怎么在项目中引入和适用WEUI,在网上找了好多资料,很多都是用在小程序上,并没有找到java上面的,一路摸索,找出一条路,分享给大家,希望对你有用

1、WeUI 是一套与微信原生 UI 一致的 UI 库,核心文件是 weui.css,只需要获取到该文件,然后在页面中引入,即可使用 WeUI 的组件。所以最主要的是将weui.css下载下来,

https://github.com/Tencent/weui/wiki适用浏览器查看此页面,这个是微信官方的说明

点击图片的红色方框,浏览其中的关于WEUI的说明和下载方式。

不过我的下载的CSS是在https://github.com/Tencent/weui/wiki的底部,如图

将红色框中的两个css文件使用迅雷的方式下载下来。

将下载的css文件放入在项目的WebContent/WebRoot下面的css文件夹中,

在HTML或jsp中,通过引用,使用WEUI样式,如图

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
        <title>WeUI</title>
        <!-- 引入 WeUI -->
        <link rel="stylesheet" href="path/to/weui/dist/style/weui.min.css"/>
    </head>
    <body>
        <!-- 使用WEUI -->
        <a href="javascript:;" class="weui-btn weui-btn_primary">绿色按钮</a>
    </body>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_38610651/article/details/85162975