样式引用

两种方式引用：

  • style内使用@import语法引入
  • 在style标签上通过src引入

前者会被内联打入 组件/页面 对应的wxss文件，后者则是会将src对应的文件收集到wxss文件夹里，再在 组件/页面 对应的wxss文件中通过@import引入。

在一个mpx文件中，两者可以同时使用，例如：

  1. <!--src/components/test.mpx-->
  2. <!--省略template\script\json部分-->
  4. <!--这个部分的样式会被收集进wxss文件夹再被test.wxss引入-->
  5. <style src="../common/index.css"></style>
  7. <style>
  8. /*这个部分的代码会被内联打入test.wxss*/
  9. .test {
  10.   background-color: red;
  11. }
  12. </style>
  14. <!--也可以使用样式预处理语言比如sass、stylus、less等等-->
  15. <style lang="scss" src="../style/test.scss"></style>

建议对于多个 页面/组件 公用的样式，使用src形式引入，避免一份样式被内联打成多份。