wxss_1

WXSS (WeiXin Style Sheets)是一套样式语言，用于美化 WXML 的组件样式

核心内容

选择器

属性选择器：

尺寸单位：rpx

开发时一般以iPhone6作为模版

边距：

文本：

字体：

样式导入：

wxml代码：

<view class="box">
  IKUN
</view>

      样式导入的作用:

代码复用
可以将通用的样式（如颜色、字体、间距等）提取到单独的文件中，通过 @import 在多个页面或组件中复用，避免重复编写代码。

模块化管理
将样式按功能或模块拆分到不同的文件中，通过导入方式组织代码，使项目结构更清晰，便于维护。

提高开发效率
在多个页面或组件中使用相同的样式时，只需修改导入的样式文件，所有引用该文件的地方都会自动更新，减少重复工作。

减少代码冗余
通过导入共享样式，避免在每个页面或组件中重复定义相同的样式，减少代码量。

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

2. 局部样式
在页面的 .wxss 文件中定义的样式为局部样式，只作用于当前页面。

① 当局部样式和全局样式冲突时，根据 就近原则 ，局部样式会 覆盖 全局样式
② 当局部样式的 权重大于或等于 全局样式的权重时，才会覆盖全局的样式

当定义了全局样式后可以通过改变局部样式来实现优化美化

flex布局：

先开启父元素的flex布局方式

语法格式：

如.container {
  flex-direction: row | row-reverse | column | column-reverse;
}

 

     flex-wrap:换行规则-------nowrap默认不换行  wrap换行             wrap-reverse:逆向换行