微信小程序 全局css,[微信小程序之小白教程系列] 微信小程序 -- 样式（WXSS）

问题来了？既然如此，我们为何还要写这篇文章？

答案只有一个，让你更快的“易懂”，换换思路，接下来的文章会对官方文档做一个段落类的解释。

为了适应广大的前端开发者，WXSS 具有 CSS 大部分特性。同时为了更适合开发微信小程序，WXSS 对 CSS 进行了扩充以及修改。与 CSS 相比，WXSS 扩展的特性有：尺寸单位和样式导入。

补充：关于扩展的特性我们下面会说，既然文档说了WXSS具有CSS 大部分特性，那么有什么不同那？

1、没有body

是的，在小程序的每一个page里是没有body属性的，不过你可以通过在wxss中对page的设置来影响整个页面的样式，比如下面的代码

page {

background:#F8F8F8

}

诸如此类，当然你也可以设置page的xxx.json中的backgroundColor属性来影响一个page页面下拉时出现的空白区域的颜色，一般来说当你页面有下拉刷新和上拉加载功能时，往往要设置backgroundColor属性。

2、没有父子关系(现在版本已经支持了，这条过。)

在使用css的时候，我们经常让样式的层级关系和html接点的层级关系保持一致，比如你的html代码中有下面代码

我们习惯于css的写法如下

.box .content strong {}

这样写的好处是strong的样式不会去影响其他地方的strong。但是在小程序中并不支持这种父子的层级关系。你只能一个一个的设置，看下面的小程序代码

针对于上面的视图，对应的wxss应