WeUI 专为微信Web服务量身定制

WeUIT体验.gif

概述

WeUI是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信 Web 开发量身设计，可以令用户的使用感知更加统一。包含button、cell、dialog、toast、article、icon等各式元素。

手机预览

请用微信扫码或长按识别

WeUI二维码.png

WeUI核心组件

**WeUI组件**目前不是很丰富，但是能满足大部分需求了。体验就更不用说了，自己试过就知道，使用起来也非常方便直接copy。**WeUI** 的核心文件就是 **weui.css**，如果发布正式环境环境，可以压缩一下。

WeUI核心组件.jpg

简单框架搭建

    
    
    
    
    


    
    绿色按钮



备注：HTML头部 viewport 的meta标签，body标签的ontouchstart属性也需要加上。

HTML使用WeUI的基本框架搭建好了，可以随意使用WeUI的各种组件了，官方Demo直接copy 就OK了。

示范组件-对话框Dialog

在移动web开发中经常有对话框提醒的业务，那么我们就来看一下使用WeUI的对话框组件的效果吧！

自定义对话框

自定义对话框.png

    

    

        
弹窗标题
        
自定义弹窗内容
...
        

            取消
            确定
        
    

对话框.png

    

    

        
弹窗标题
        
弹窗内容，告知当前页面信息等
        

            确定
        
    

好了，其他组件大家可以尝试自己尝试一下啦！
更多经常内容请大家关注“IT实战联盟”公众号哦~~~

IT实战联盟.jpg