猫头鹰选择器(*+*)解决外边距问题

为解决多个选择器外边距堆叠问题,或者多个组件之间间距问题,如列表,导航等,采用 *+* 简称猫头鹰选择器解决,具体如下:

*+*,开头是一个通用选择器*,+是相邻组合器,后一个*是另一个通用选择器。它选择了页面上有着相同父级的非第一个元素。可实现侧边栏每个元素等距等。

body * + *{
margin-top:1.5em;
}

以上代码全局设置上下堆叠的元素的间距。

下面为具体演示示例

https://codepen.io/AllThingsSmitty/pen/gMRvWqhttps://codepen.io/AllThingsSmitty/pen/gMRvWqCSS 专业技巧 - 《CSS 专业技巧》 - 书栈网 · BookStackCSS 专业技巧 一个帮你提升 CSS 技巧的收藏集。https://www.bookstack.cn/read/css-protips-zh/css.md添加个其他css技巧的网址,下面网站在线测试代码较为好用

https://codepen.io/pen/icon-default.png?t=M0H8https://codepen.io/pen/

猜你喜欢

转载自blog.csdn.net/lap2004/article/details/122928528