请问是否有一个父组件(比如:antd的某个组件)可以让它的子元素们进行间隔开来?

请问下是否有方法或者现有的组件可以做到子组件都有一定的间隔?

我在使用antd的时候
image.png

默认,两个按钮的布局是紧挨着的,

1、请问是否有一个父组件(比如:antd的某个组件)可以让它们进行间隔开来?
2、是否有方便的方法比如:写一个父div里面有style,让所有的子组件进行间隔开来?

阅读 2.4k
1 个回答

antd 提供了 Space 组件。

https://ant.design/components/space-cn/

CSS 的话可以直接 * 匹配全部后代,然后加 margin 处理:

.space > * {
    margin-left: 8px;
    margin-right: 8px;
}
<div class="space">
  <div>A</div>
  <div>B</div>
</space>

最初 Space 组件其实就是这样简单粗暴的。当然了现在的实现还是挺复杂的,要考虑后代元素本身是否已经有 margin、原本 display 是什么,还要考虑方向、折行等等。感兴趣可以自己阅读源码。

推荐问题
logo
Microsoft
子站问答
访问
宣传栏