142 - 修炼 - 小程序的知识点11

2021-03-22 12:51:49 浏览数 (1)

你好呀,本周和你来聊聊小程序的样式导入。

样式导入,听起来玄乎,它其实是 WXSS 的一个子知识点。它的实质是一个操作,可以将样式文件导入到当前的文件中,以达到样式复用的目的。

给你讲个故事:八戒和悟空一起抄写经书,八戒抄写得慢,估摸着抄完时间就用的差不多了,都没有时间排版。这个时候抽了一眼悟空,看着他都已经快排版结束了,于是和悟空要了排版好的模板,在誊抄好之后,就将内容导入模板,一下子就完成了排版,终于在最后一刻提交了经书,完成了任务,救出了师父。

从上面这个例子可以看到,样式一旦可以被标准化,它就有了被复用的可能。此外,一旦它有了被复用的需求,它将能提高办事效率。

那么一个新的问题便出现了,想要使用样式导入,该怎么办呢?

首先需要构造一个通用的模板样式表,如下:

代码语言:javascript复制
/** article.wxss **/
.book{
  font-size:20px;
  color:black;
}

其次,在需要导入的样式表里面,使用 @import 标签导入,如下:

代码语言:javascript复制
/** bajie.wxss **/
@import './article.wxss'

最后,在需要显示的页面中,向一般使用样式表的样子使用就可以了。如下:

代码语言:javascript复制
/** bajie.wxml **/
<view class='book'>
   hello world. 
</view>

这里是怀英的小茶馆,有空来坐坐。

0 人点赞