微信小程序 使用全局CSS

3,494 阅读1分钟

1、使用全局的app.css

  • app.wxss 是全局样式文件,对每个页面都起作用 所以如果某个页面不想要这个样式的话,可以在那个页面再单独定义样式覆盖全局默认样式,也可以在公共文件夹下创建一个公共的wxss 例如:common.wxss,然后引入到此app.wxss下;
  • 微信小程序样式可以 @import其他样式文件;
  • 支持常用的 :after,:before, :first-child , nth-child 等常用伪劣选择器.

2、引入其他样式文件

使用 @import 导入外联样式表,
@import 使用 外联样式表的相对路径
在公共文件中创建demo.wxss文件后
直接在所需要引入的wxss文件中引入 或者在app.wxss中引入
@import "demo.wxss“;

3、常用支持的选择器

选择器 demo
类选择器 .class
ID选择器 #id
标签选择器 view
后代选择器 .class .child-class
:after view:after
:before view:before
:first-child view:first-child
:last-child view:last-child
:nth-child view:nth-child(even) view:nth-child(odd)