02 组件命名遇见的坑

主页面中使用的组件,命名为my-margintop
在主页面。写css样似不起作用的哈
因为官方说的  组件对应 wxss 文件的样式,【只对组件 wxml 内的节点生效】
<view class="top-header">
    <!-- 左边姓名  右边头像 -->
    <topleftnamerihtdec class="my-margintop"></topleftnamerihtdec>
</view>

详细解释

主页面。没有效果
.my-margintop {
    margin-top: 120rpx;
}

如何解决了。????
只能够在子组件中对向的wxss去写样似哈

官方说的

组件对应 wxss 文件的样式,【只对组件 wxml 内的节点生效】编写组件样式时,需要注意以下几点:

组件和引用组件的页面不能使用 id 选择器(#a)、属性选择器([a])和标签名选择器,请改用 class 选择器。
组件和引用组件的页面中使用后代选择器(.a .b)在一些极端情况下会有非预期的表现,如遇,请避免使用。
子元素选择器(.a>.b)只能用于 view 组件与其子节点之间,用于其他组件可能导致非预期的情况。
继承样式,如 font 、 color ,会从组件外继承到组件内。
除继承样式外, app.wxss 中的样式、组件所在页面的的样式对自定义组件无效(除非更改组件样式隔离选项)。

#a { } /_ 在组件中不能使用 _/
[a] { } /_ 在组件中不能使用 _/
button { } /_ 在组件中不能使用 _/
.a > .b { } /_ 除非 .a 是 view 组件节点,否则不一定会生效 _/
posted @   何人陪我共长生  阅读(158)  评论(0编辑  收藏  举报
编辑推荐:
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 一个奇形怪状的面试题:Bean中的CHM要不要加volatile?
· [.NET]调用本地 Deepseek 模型
· 一个费力不讨好的项目,让我损失了近一半的绩效!
阅读排行:
· 百万级群聊的设计实践
· 永远不要相信用户的输入:从 SQL 注入攻防看输入验证的重要性
· 全网最简单!3分钟用满血DeepSeek R1开发一款AI智能客服,零代码轻松接入微信、公众号、小程
· .NET 10 首个预览版发布,跨平台开发与性能全面提升
· 《HelloGitHub》第 107 期
点击右上角即可分享
微信分享提示