如何在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;
}

尝试