如何去除边框内Widget的内边距?Pinterest嵌入组件CSS求助
如何去除Pinterest嵌入组件的内边距
你需要覆盖Pinterest嵌入组件内部容器的默认内边距样式,以下是修改后的完整CSS代码,在你现有代码基础上添加了移除内边距的规则:
span[data-pin-log="pinterest"] { overflow: scroll; overflow-x: hidden; } span[data-pin-log="embed_grid"]::-webkit-scrollbar { width: 0; /* 隐藏滚动条空间 */ background: transparent; /* 可选:让滚动条完全透明 */ } /* 可选:显示红色的滚动条指示器 */ span[data-pin-log="embed_grid"]::-webkit-scrollbar-thumb { background: #FF0000; } #pinterest [class$=_button] { display: none !important; } #pinterest [class$=_hd] { display: none !important; } body > span[data-pin-log="embed_grid"] { border: none; } /* 新增:移除嵌入组件内部的内边距 */ span[data-pin-log="embed_grid"] .pin-embed-grid { padding: 0 !important; } /* 确保内部子容器无额外边距 */ span[data-pin-log="embed_grid"] .pin-embed-grid > div { margin: 0 !important; padding: 0 !important; }
说明:
- 新增的第一条规则直接针对Pinterest嵌入网格的容器,将内边距设为0,
!important用来强制覆盖组件的默认样式 - 第二条规则是为了确保容器内的子元素也没有额外的外边距或内边距,避免出现间隙
如果上述选择器不生效(Pinterest可能会更新类名),可以尝试更通用的选择器:
[data-pin-log="embed_grid"] .pin-board { padding: 0 !important; }
把这些CSS添加到你的样式表中,就能实现和取消勾选框一致的无内边距效果。
内容的提问来源于stack exchange,提问作者boohoo
相关产品推荐
相关产品推荐

