微信程序制作超简单，只要跟我小编上一篇教程，一定上手了吧！上一次教大家写了一个最简单的Hello world微信小程序。但是，那只是一个裸页面，并不好看。今天接着往下讲，如何为这个页面添加样式，使它看上去更美观，教大家写出实际可以使用的页面。
一、总体样式
微信小程序允许在顶层放置一个app.wxss文件，里面采用CSS语法设置页面样式。这个文件的设置，对所有页面都有效。
注意，小程序虽然使用CSS样式，但是样式文件的后缀名一律要写成.wxss。
打开上一篇教程的示例，在项目顶层新建一个app.wxss文件，内容如下。
page{
background-color:pink;
}
text{
font-size:24pt;
color:blue;
}
上面代码将整个页面的背景色设为粉红，然后将<text>标签的字体大小设为24磅，字体颜色设为蓝色。
开发者工具导入代码之后，得到了下面的渲染结果。
可以看到，页面的背景色变成粉红，文本字体变大了，字体颜色变成了蓝色。
实际开发中，直接对<text>标签设置样式，会影响到所有的文本。一般不这样用，而是通过class属性区分不同类型的文本，然后再对每种class设置样式。
打开pages/home/home.wxml文件，把页面代码改成下面这样。
<view>
<text class="title">hello world</text>
</view>
上面代码中，我们为<text>标签加上了一个class属性，值为title。
然后，将顶层的app.wxss文件改掉，不再直接对<text>设置样式，改成对class设置样式。
page{
background-color:pink;
}
.title{
font-size:24pt;
color:blue;
}
上面代码中，样式设置在class上面（.title），这样就可以让不同的class呈现不同的样式。修改之后，页面的渲染结果并不会有变化。
