小程序自定义组件—组件样式

目标

掌握组件样式的编写注意点及组件样式隔离解决方案。

内容

1. 组件中的样式不要使用标签选择器
2. 组件中，样式默认是隔离的： 自定义组件的样式只受到自定义组件 wxss 的影响
3. 通过对组件的配置，可以取消这个隔离的状态。

组件中的样式不要使用标签选择器

使用会报警告

标签选择器本身就是一个坏选择： 页面上样式中的标签选择器也会作用于组件

组件中，class选择器的样式默认是隔离

默认情况下，自定义组件的样式只受到自定义组件 wxss 的影响。

1. 组件的class选择器不会影响页面元素
2. 页面的class选择器不会影响组件元素

 样式隔离注意点

• app.wxss中的全局样式对组件无效

• 只有class选择器具有样式隔离效果，id选择器、属性选择器、标签选择器不受样式隔离的影响

 建议：在组件和引用组件的页面中建议使用class选择器，不要使用id、属性