weui-wxss

一、使用weui 　　学习一个新的技术，想要最短时间掌握并熟练使用它，那就是直接做项目了。把技术直接应用到项目中来，直接做出东西，这是我的方法，因为我很懒不太喜欢看一步一步看文档，看理论。 　　那怎么使用weui，应用到项目中来呢？ 　　1、因为小程序不使用npm，所以直接去github把weui下载下来： 　　　　　　 https://github.com/Tencent/weui-wxss/ 　　2、用微信开发者工具打开刚下载下来的weui项目：weui-wxss-master，看看这里面都有些什么，要用到什么就直接取他的页面代码 　 =============================================================== 　　二、开一个微信小程序新项目，把weui库应用进去，怎么应用的呢？看下面步骤 　　　　2.1、新建一个微信小程序项目：weui-demo 　　2.2、在weui-wxss-master里找到weui.wxss文件放到自己新项目的根目录下，如： 　　　　　　　　网上是这么说的，我也这么放了，但是报错，如下：在此说一句：fuck , 我去尼玛的什么鬼 　　。。。不好意思找错weui.wxss文件了，应该是dist目录下的style目录下的weui.wxss文件 　　正确的文件应该是：weui-wxss-master

首先来看下WeUI的官方介绍： WeUI 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信内网页和微信小程序量身设计，令用户的使用感知更加统一。在微信小程序的开发过程中，涉及到的前端复杂的样式界面的问题，就需要使用个UI框架，这样可以省去以后很多麻烦。 WeUI作为一个开源的移动端UI框架，由于它是微信官方提供的对微信的兼容性没有太大问题，而且和各组件的样式和微信一样，能够很好地和微信融合在一起，给用户较好的体验。 使用步骤 1、在GitHub上 https://github.com/weui/weui-wxss/ 下载程序代码，解压后可以看到如下目录： 图片.png 2、我们只需要将weui-wxss-master\dist\style\weui.wxss文件导入到小程序项目的根目录下： 图片.png 3、新建微信小程序项目，将weui.wxss文件导入到小程序项目的根目录下： 图片.png 图片.png 4、在项目中引用：在全局app.wxss中加入weui.wxss的引用- @import "weui.wxss"; 图片.png 5 根组件使用class=”page” <view class= "page"> </ view> 6 页面骨架 <view class= "page"> < view class= "page__hd"> </ view> <!-