html - 为什么只应用了我的一些 CSS？

Question

我不知道为什么，但是无论我做什么，tbody 中 SIGN UP 的灰色边框都不会消失。我试过使用类(结合 ID，所以这不是一个重要的问题)，我试过使用伪类(:4th-child {border:none})，而且真的唯一可行的是从 #signup td: 中移除整个 border-right:1px solid gray，这并不是一个好的选择。相关代码如下:

HTML

  <div id="signup">
    <form action="" method="GET" id="form">
      <fieldset>
        <table>
          <thead>
            <tr>
              <th><label for="signupname">Sign Up</label></th>
            </tr>   
          </thead>
          <tbody>
            <tr>
              <td><input id="signupname" placeholder="Your Name"></td>
              <td><input type="password" placeholder="Password"></td>
              <td><input type="email" placeholder="Email (optional)"></td>
              <td><input type="submit" value="Sign Up"></td>
            </tr>
          </tbody>
        </table>
      <fieldset>
    </form>
  </div>

CSS

#signup{
  height:28%;
  min-height:90px;
  background-color:seashell;
  padding-top:1px;
  margin-top:-1px;
}
#signup label{
  font:200% Corbel;
  text-shadow:0px 1px 0px white;
  color:maroon;
  font-weight:bold;
}
#signup table{
  margin:2% auto;
}
#signup td{
  padding:5px 50px;
  border-right:1px solid gray;
}
#signup th{
  padding:0 50px;
}
#signup input{
  font:130% Trebuchet MS;
  padding:5px 5px;
}

谢谢!

Answer 1

你对第 nth-child 的语法是错误的

#signup td:nth-child(4) {
  border: none;
}

或者更好的方法是使用 last-child

#signup td:last-child {
  border: none;
}

或者，您可以在 td 中添加一个类:

<td class="submitrow"><input type="submit" value="Sign Up"></td>

...

#signup td.submitrow {
  border: none;
}