为帮助网页开发者实现与微信客户端一致的视觉体验，并降低设计和开发成本，微信团队推出了网页设计样式库：WeUI。

该样式库目前包含 button (按钮)、cell (单元格)、toast (浮层提示)、dialog (对话框)等网页常用的各式元素，并已在 GitHub 上开源

开发者只需三步，就能在自己的网页上轻松实现按钮、浮层提示等功能：
1. 根据文档说明，下载 WeUI 库。
2. 在页面中引入 weui.min.css 文件。
3. 从官方 demo 中拷贝需要的功能组件代码到自己页面即可。

Demo 体验地址：WeUI演示。

详情请点击：开发者文档。

项目地址 https://github.com/weui/weui

摘自：https://www.vxzsk.com/50.html

微信WeUI入门的更多相关文章

  1. 微信WeUI入门2

    引入需要的样式文件 最重要的css文件为 weui.min.css 基本的框架如下: <!DOCTYPE html> <html lang="zh-CN"> ...

  2. 微信 + weui 框架记录

    WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信内网页和微信小程序量身设计,令用户的使用感知更加统一: 包含button.cell.dialog. progress. to ...

  3. 微信 weui 初体验

    最近微信推出他们自己的H5组件(weui)组件的优点有两个: 做为开发者的我们可以不用写太多css,直接拿过来就可以用. 组件都有点击态,大大增加了用户的体验好感 高清屏幕下 border : 0.5 ...

  4. 微信WeUI扩展组件

    主要包括 下拉刷新pullToRefresh downRefresh.html 主要的代码是$(document.body).pullToRefresh(); <div class=" ...

  5. 微信WeUI基础

    首先引入样式css和js 虽然基础的其实还有weui.min.css,但是为了一些动态效果,也要引入其他的东西. 基本框架 <!DOCTYPE html> <html lang=&q ...

  6. 微信WeUI常见页面模板

    购物车模板 就是popup弹层(css样式+js),还有slider滑动操作,还有增减的js 代码: <!DOCTYPE html> <html lang="zh-CN&q ...

  7. nrf51822微信开发入门学习笔记1：开始前的准备

    参考:(id:love--baby)https://blog.csdn.net/hunhun1122/article/details/68922493 微信硬件平台:https://iot.weixi ...

  8. 基于Jquery WeUI的微信开发H5页面控件的经验总结(2)

    在微信开发H5页面的时候,往往借助于WeUI或者Jquery WeUI等基础上进行界面效果的开发,由于本人喜欢在Asp.net的Web界面上使用JQuery,因此比较倾向于使用 jQuery WeUI ...

  9. koa 微信小程序 项目

    这个微信号入门, 应该能自己模仿做一个微信公众号了 另外 微信小程序开发 和 微信公众号h5嵌入 还是有区别的 h5嵌入在体验上和 微信小程序 差距还是比较大, 因为小程序直接调用了微信的原生组件, ...

随机推荐

  1. Linux下.Net Core+Nginx环境搭建小白教程

    前言 对于接触.Net Core的我们来说之前从未接触过Linux,出于资源和性能及成本的考虑我们可能要将我们的环境搬到Linux下,这对于我们从未接触过Linux的童鞋们来说很棘手,那么我今天将带你 ...

  2. 【总结】 NOIp2018考时经历记

    可能我因为比较菜的原因,还是要写一下这个东西! 发布时间迟与更新时间,毕竟浙江选手为先例 那么希望NOIp8102RP++!!! 突然发现博客园支持更新创作时间了,那么就不咕了! 本次NOIp感受很深 ...

  3. python中的内置函数(一), lambda, filter, map

    https://www.processon.com/view/link/5c10da0ce4b099ae3e137bf6 1.内置函数 内置函数就是python中提供的,可以直接拿来用的函数,比如pr ...

  4. Delphi XE7中开发安卓程序一些有用的帮助资源

    说明:要想看到下面资源,打开帮助后,在搜索里面输入URL最后一部分,如果最后带“.html”,则把它删除,随后搜索一下,就看到了. 例如:想看下面的FireMonkey类关系图,只在搜索里面输入&qu ...

  5. [CISCO] 转载：冲突域与广播域（区别、知识要点）

    [CISCO] 转载:冲突域与广播域(区别.知识要点) 1.传统以太网操作(Ethernet Connection Ethernet) 传统共享式以太网的典型代表是总线型以太网.在这种类型的以太网中, ...

  6. 记一名软件实施自学转Java开发，附学习计划

    2015年毕业到现在已经3年了,而我转型开发已经有一年的时间了.写这篇文章除了记录,主要还是想分享一些经历给想要转型开发的同学们,不要走那些我走过的弯路. 2015年入职了第一家公司,当时是做的分销系 ...

  7. Leetcode 98 验证二叉搜索树 Python实现

    给定一个二叉树,判断其是否是一个有效的二叉搜索树. 假设一个二叉搜索树具有如下特征: 节点的左子树只包含小于当前节点的数. 节点的右子树只包含大于当前节点的数. 所有左子树和右子树自身必须也是二叉搜索 ...

  8. day03 --class --homework

    '''# >>>>>>2 :,有字符串s = "123a4b5c"#>>>>>^ 1: # 1)通过对s切片形成新 ...

  9. c#-MVC基础操作-数据的展示及增删改、登录页面及状态保持

    一.数据展示 1.View代码: <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynam ...

  10. 手动启动 oracle 服务

      手动启动 Oracle 服务 为了学习,我们常常会在个人PC上安装 Oracle 数据库,这大大影响了计算机的运行速度,尤其是计算机开机速度,如果 Oracle 使用频率并不是非常高,我们可以禁止 ...