使用 type 或 name 属性应用 css 选择器首类型时出现问题

Question

我正在尝试将

margin-left

添加到除第一个之外的类型为 radio 的输入元素，但它不适用。我也尝试使用

input[type=radio]

。如果

first-of-type

不适用于输入元素，我该如何实现此目的？

input[name=qualification] {
  margin-left: 3rem;
}

input[name=qualification]:first-of-type {
  margin-left: 0rem;
}

<h1>Show Checkboxes</h1>

<form action="/action_page.php">
  <input type='radio' id='qual_ug' name='qualification' value='UG'>
  <label for='qual_ug'>UG<label>
        <input type='radio' id='qual_pg' name='qualification' value='PG'>
        <label for='qual_pg'>PG<label>
        <input type='radio' id='qual_phd' name='qualification' value='PhD'>
        <label for='qual_phd'>PhD<label>    
    </form>

Answer 1

似乎@DarkBee在评论中提到，通过正确关闭标签来修复标签标签，确实应用了你的CSS。

input[name=qualification] {
  margin-left: 3rem;
}

input[name=qualification]:first-of-type {
  margin-left: 0rem;
}

<h1>Show Checkboxes</h1>

<form action="/action_page.php">
  <input type='radio' id='qual_ug' name='qualification' value='UG'>
  <label for='qual_ug'>UG</label>
  <input type='radio' id='qual_pg' name='qualification' value='PG'>
  <label for='qual_pg'>PG</label>
  <input type='radio' id='qual_phd' name='qualification' value='PhD'>
  <label for='qual_phd'>PhD</label>    
</form>