微信小程序开发之模板样式（五）

LY_945

已于 2023-03-01 14:02:06 修改

阅读量229

点赞数

分类专栏：前端文章标签：微信小程序前端小程序

于 2022-11-29 17:13:27 首次发布

本文链接：https://blog.csdn.net/qq_57991099/article/details/128100418

版权

前端专栏收录该内容

11 篇文章 0 订阅

订阅专栏

1.wxss模板样式

rpx单位尺寸

将屏幕平分成750rpx，可以适配不同的屏幕

import样式导入

/*common.wxss文件*/
.username
{
  color:red;
}

/*index.wxss文件*/
@import "/pages/common/common.wxss";

/*index.wxml文件*/
<view wx:for="{{userList}}" wx:key="id" class="username">{{item.name}}</view>

2.全局样式和局部样式

/*app.wxss*/
view{
  padding: 10rpx;
  margin: 10rpx;
  background-color: aqua;
}

view:nth-child(1)/*权重更高不会被覆盖*/
{
  background-color:lightgreen;
}

/*index.wxss*/
view{/*覆盖全局*/
  color: white;
  background-color: teal;
}