WXSS 模板样式

目录

一.样式导入

1.什么是样式导入

2.@import的语法格式 

 二.全局样式和局部样式

1.全局样式

 2.局部样式

---

一.样式导入

1.什么是样式导入

使用wxss提供的@import语法,可以导入外联的样式表.

2.@import的语法格式 

@import后跟需要导入的外联样式表的相对路径,用;表示语句结束.示例如下:

 

 编写公共样式common.wxss

 

 在需要用到的wxss界面导入common.css的路径

 

 

 样式导入成功

 

 

---

 二.全局样式和局部样式

1.全局样式

定义在app.wxss中的样式为全局样式,作用于每一个界面.

 

view{
  padding:10rpx;
  margin:10rpx;
  background-color: lightskyblue;
}

 验证:

在app.json中新建一个新的界面 

 全局样式如下

 2.局部样式

在界面的.wxss文件中定义的样式为局部样式,只作用于当前界面

注意:

• 局部与全局冲突,局部会覆盖全局
• 当局部样式权重大于等于全局样式权重,才会覆盖全局样式

 ​​​​​​​