我们在做微信小程序的时候，往往会因为页面怎么设置的好看而烦恼。今天来我们来教大家如何使用ColorUi制作一个精美的消息列表。首先来回顾一下上一期的内容，没看的同学们可以回头看一下。
介绍一款微信小程序前端界面利器COLORUI，让你的小程序变美
在讲解范例前，我们上一张图，看看实操后的最终效果
消息列表最终效果
下面我们开始实操演练。
打开上一节的DEMO小程序
创建comment目录
1.在Pages目录下创建comment目录
创建list页
2. 在comment下新建一个page，名字为list，开发者工具会自动补全其它相关页。
编辑list页面
3.去ColorUi的项目中拷贝代码过来
这里是ColorUI的源代码
粘贴到我们的list页，然后编译看下效果。看下图可以看到一团遭。
这是什么原因呢？
因为我们还没有引入ColorUI。
引入ColorUI
切换到app.wxss，在页面里加上上图的两行代码，这样就成功引入了ColorUI.
引入ColorUI后，再编译一下看效果。登登登，是不是漂亮了好多？
大家做出来应该是这个样的：
最终效果
好啦，这一期就到这里，下一期我们来说下自定义页脚导航，小程序新手一般都会问的问题。
更多的搜智干货内容请持续关注搜智相关的视频和文章，以上内容均为搜智原创内容，如有转载请注明出处