html - 如何在 CSS 中的搜索框内的按钮之间生成分隔符

Question

我有一个输入搜索框，在搜索框的右端有两个按钮。将来我会在右侧添加更多按钮。因此，我正在考虑每当一个按钮的右侧有另一个按钮时自动生成按钮分隔符。这可能只用 CSS 来完成吗？

目前我只使用以下 css 规则将按钮分隔符生成为两个按钮之间的一个小点。但这仅特定于 RESET 按钮。我在重置按钮旁边有另一个名为“搜索按钮”的按钮。现在，如果我添加一个新的按钮名称“图像按钮”，我需要自动生成一个分隔符。我不想为分隔符使用单独的 div。可能吗？

.search-field__reset-button::after {
  position: absolute;
  right: 0;
  height: 1.5rem;
  content: '';
  border-right: 1rem solid black;
}

Answer 1

button{
  color:red;
}

button + button{
  margin-left:20px;
}

试试这个