小程序通用页面 第1篇
运行项目：
好了 到这里列表加载更多 公用写法，基本都说完了，如果小伙伴还有疑问，可以 公众号 加群，我们一起进步
本案例下载地址：
- End -
▽
小程序通用页面 第2篇
微信小程序允许在顶层放置一个文件，里面采用 CSS 语法设置页面样式。这个文件的设置，对所有页面都有效。
注意，小程序虽然使用 CSS 样式，但是样式文件的后缀名一律要写成.wxss。
打开上一篇教程的示例，在项目顶层新建一个文件，内容如下。
上面代码将整个页面的背景色设为粉红，然后将标签的字体大小设为 24 磅，字体颜色设为蓝色。
可以看到，页面的背景色变成粉红，文本字体变大了，字体颜色变成了蓝色。
实际开发中，直接对标签设置样式，会影响到所有的文本。一般不这样用，而是通过class属性区分不同类型的文本，然后再对每种class设置样式。
打开pages/home/文件，把页面代码改成下面这样。
上面代码中，我们为标签加上了一个class属性，值为title。
然后，将顶层的文件改掉，不再直接对设置样式，改成对class设置样式。
上面代码中，样式设置在 class 上面（.title），这样就可以让不同的class呈现不同的样式。修改之后，页面的渲染结果并不会有变化。
小程序通用页面 第3篇
如果页面的所有样式都自己写，还是挺麻烦的，也没有这个必要。腾讯封装了一套 UI 框架 WeUI，可以拿来用。
手机访问 ，可以看到这套 UI 框架的效果。
这一节就来看看，怎么使用这个框架的小程序版本 WeUI-WXSS，为我们的页面加上官方的样式。
首先，进入它的 GitHub 仓库，在dist/style目录下面，找到这个文件，将源码全部复制到你的文件的头部。
然后，将page/home/文件改成下面这样。
开发者工具导入项目代码，页面渲染。
可以看到，加入 WeUI 框架以后，只要为按钮添加不同的 class，就能自动出现框架提供的样式。你可以根据需要，为页面选择不同的按钮。
这个示例中，元素使用了下面的class。
WeUI 提供了大量的元素样式，完整的清单可以查看这里。
小程序通用页面 第4篇
小程序原生的
上面页面的图片上面，有三个提示点，表示一共有三张图片，可以切换显示。
它的代码很简单，只需要改一下文件即可。
上面代码中，组件就是轮播组件，里面放置了三个
组件的indicator-dots属性设置是否显示轮播点，autoplay属性设置是否自动播放轮播。它们的属性值都是一个布尔值，这里要写成{{true}}。这种{{...}}的语法，表示里面放置的是 JavaScript 代码，这个放在下一次讲解。