问答题1211/1647小程序 WXSS 与 CSS 的区别?

难度:
2021-07-07 创建

参考答案:

小程序 WXSS (WeiXin Style Sheets) 与标准 CSS 在核心概念上保持一致,但针对小程序运行环境做了特定调整和扩展,主要差异体现在以下几个方面:

  1. 尺寸单位扩展 WXSS 在传统 CSS 单位基础上引入了 rpx(responsive pixel)单位,可根据屏幕宽度进行自适应缩放(1rpx ≈ 0.5px @750px 设计稿标准)。这种设计简化了多端适配工作流,而标准 CSS 需要依赖 rem/vw 等方案实现类似效果。

  2. 样式隔离机制 小程序默认启用样式隔离,组件样式不会影响外部页面。这种隔离通过给组件添加唯一属性选择器实现,与标准 CSS 的全局作用域形成对比。CSS Modules 或 Scoped CSS 虽然能实现类似效果,但需要额外配置。

  3. 选择器支持差异 WXSS 选择器支持度约为 CSS2 水平,部分 CSS3 选择器(如 :first-child)可能表现不一致。特别限制包括:

  • 不支持属性选择器
  • 不支持级联选择器(如 div p)
  • 通配符 * 作用范围有限
  1. 预处理器支持 原生 WXSS 不支持 Sass/Less 等预处理语法(需依赖构建工具转换),而现代 CSS 开发通常直接集成预处理工具链。

  2. 导入方式 WXSS 使用 @import 语句时必须指定相对路径,且不支持 CSS 原生 @charset 规则。

最近更新时间:2025-07-16

赞赏支持

题库维护不易,您的支持就是我们最大的动力!