小程序.我还是不知道起什么名字

全局配置

加个字体

代码会将welcome页面中的所有text组件的字体更改为微软雅黑。那我们思考一个问题，假如现在有100个页面，而100个页面里几乎所有的字体都应该是微软雅黑。在100个页面里重复设置字体这并不是一个很好的解决方案。

所以，我们需要有一个全局样式表，可以为所有页面设置“默认”样式。小程序为我们提供了一个这样的样式表文件，就是前面提到过的app.wxss文件。

抱歉,写错地方了

如果不想在某个页面中使用全局默认样式，那么只需要在相应页面的wxss文件中重新定义这个样式即可。小程序会优先选择页面的wxss文件，而不是app.wxss文件。

这个也是css的内容，样式选择器的优先级。

到目前为止，我们的welcome页面已经像那么回事儿了。但页面的样式和设计图还不太一样，设计图中整个页面呈现的是橘红色，而现在的页面还是白色。那么，来修改一下页面的背景颜色吧。

要修改页面整体的背景色，需要寻找一个包裹所有页面元素的容器，并设置这个容器的背景色。那么，首先尝试给页面最外层view（class="container"的这个view）一个背景色。在welcome.wxss文件中的.container样式里新增属性background-color: #ECC0A8。

并不是整个页面都呈现出橘红色，只是有元素占据的地方才呈现出橘红色。原因是因为最外层的container view没有固定的高度，它的高度由其内部子元素决定，所以橘红色部分的下边刚好和按钮的下边重合。

如何解决这个问题呢？

可以通过给container view一个固定的高度来解决这个问题，但这并不是最好的办法。因为在不同的机型上，屏幕的尺寸是不一样的，固定的高度无法去适配不同的机型，可能出现滚动条，也可能橘红色无法覆盖整个页面。

当然，用我们前面学到的rpx是可以解决这个问题的，将container view的高度单位设置为rpx，就可以让它随着不同的机型进行自适应调整。但这看起来很蠢，高度具体设置多少，还需要我们了解iPhone 6的屏幕分辨率。所以，这依然不是一个很好的解决方案。

查看一下页面结构

注意到 container外面还有page页面

page代表着整个页面的容器，如果想对页面整体做样式或者属性设置，那么应该考虑page这个页面的根元素。

话说好像电量是我的电脑电量

很遗憾这个导航栏不可以隐藏或者取消，它必须存在。我们之所以说小程序无论从开发还是设计上都比较简单，有很大一部分原因是因为小程序做了很多这样的“强制性约束”，不给开发者很大的自由度，自然简单。这固然是因为小程序设计初衷就是用来快速开发轻量级应用的，但也有一部分原因是因为小程序目前还处于生态的早期阶段，官方没有那么多精力支持非常丰富的组件接口。

既然这个导航栏无法取消，如何让整个页面只有一种颜色呢？下面我们考虑将导航栏的颜色和页面的背景色设置成同一个颜色

。

在前面 我使用了app.json的一个配置项pages，用来注册小程序页面文件.

window配置可项用来设置小程序的状态栏、导航栏、标题和窗口的背景色。我先来学习window配置项下能够更改导航栏颜色的属性：navigationBarBackgroundColor。在app.json文件中加入一个window配置项，并设置window的属性navigationBarBackgroundColor值为#ECC0A8。更改后的app.json文件代码如下：

嘻嘻,浑然一体嗷

现在，我们的欢迎页面是不是很像各类iOS和Android App的启动页面？

当然，window这个选项下并不是只有navigationBarbackgroundColor这一个属性，它还有以下几种属性：

• navigationBarTextStyle　配置导航栏文字颜色，只支持black/white。

• navigationBarTitleText　配置导航栏文字内容。

• backgroundColor　配置窗口颜色。

• backgroundTextStyle　下拉背景字体，仅支持dark/light。

• enablePullDownRefresh　是否开启下拉刷新。