css设置子内容之间的间距

可以使用CSS的margin属性来设置子内容之间的间距。

例如，如果要在一个容器中垂直排列两个子元素，并且希望它们之间有10像素的间距，可以这样设置CSS样式：

.container {
display: flex;
flex-direction: column;
}

.container > * + * {
margin-top: 10px;
}

这里使用了弹性盒子布局（display: flex），并且将其方向设置为竖直排列（flex-direction: column）。然后，使用选择器.container > * + *，选择容器中的所有子元素，除了第一个子元素之外，并为它们设置顶部外边距（margin-top）为10像素。这样就可以在两个子元素之间创建一个10像素的间距。

相关问题

css 最后一行不设置间距

如果你想在 CSS 中去掉最后一行的间距，可以使用 `:last-child` 选择器来选中最后一个子元素，然后设置其 `margin-bottom` 或 `padding-bottom` 为 0，例如：

/* 去掉最后一个 <p> 元素的下边距 */
p:last-child {
  margin-bottom: 0;
}

这样就可以保证最后一行与下面的元素之间没有间距了。

设置子元素的行间距以及居中

你可以使用 CSS 来设置子元素的行间距和居中。具体的方法如下：

1. 设置行间距：使用父元素的 `line-height` 属性来设置行高，可以让子元素之间的行间距变大或变小。例如：`line-height: 1.5;` 表示行高为字体大小的 1.5 倍。

2. 设置居中：使用父元素的 `display: flex;` 和 `justify-content: center;` 属性来让子元素水平居中。如果需要垂直居中，可以使用 `align-items: center;` 属性。

下面是一个示例代码：

<div class="parent">
  <div class="child">子元素 1</div>
  <div class="child">子元素 2</div>
  <div class="child">子元素 3</div>
</div>

.parent {
  line-height: 1.5;
  display: flex;
  justify-content: center;
  align-items: center;
}

.child {
  /* 子元素样式 */
}

上面的代码将父元素的行高设为字体大小的 1.5 倍，让子元素之间的行间距变大。同时，使用 `display: flex;` 和 `justify-content: center;` 让子元素水平居中，使用 `align-items: center;` 让子元素垂直居中。你可以在 `.child` 的样式中添加其他样式来定义子元素的样式。