html - 如何仅删除字段集边框而不删除字段集内元素的边框？

Question

示例如下

我有一个带有字段集和按钮的表单。按钮和字段集周围都有边框。我希望边框只对字段集消失。怎么办？

(我的示例中的 CSS 删除了两个边框 - 对于字段集和按钮，当我希望按钮保持不变时)

#select_spec_form #submit_button {
  border: 0;
}

<form id="select_spec_form">
  <fieldset id="submit_button">
    <input name="submit[submit]" id="submit_button" value="View" type="submit">
  </fieldset>
</form>

Answer 1

只需将选择器更改为仅选择字段集#select_spec_form fieldset。也不要对两个不同的元素使用相同的 ID。

/* Remove the ID from selector if you want to select all the fieldset in the same page and container */

#select_spec_form fieldset#another_ID {
  border: 0;
}

<form id="select_spec_form">
  <fieldset id="another_ID">
    <input name="submit[submit]" id="submit_button" value="View" type="submit">
  </fieldset>
</form>