使用 last-child 选择器减少 css

Posted 2023-03-06

【中文标题】使用 last-child 选择器减少 css

【英文标题】：less css using last-child selector

【发布时间】：2013-04-30 12:58:45

【问题描述】：

我正在使用less 并试图让last 输入具有10px 的ma​​rgin-bottom。这是我所拥有的，但它不起作用，并且没有在最后一个输入上应用 margin-bottom 。任何想法为什么？

input 
  margin-bottom: 0px;

  &:last-child 
    margin-bottom: 10px;
  

还有 html

<form id="auth-form">
  <input id="ember367" class="ember-view ember-text-field" placeholder="Email" type="email" name="email">
  <input id="ember368" class="ember-view ember-text-field" placeholder="Password" type="password" name="password">
  <div class="clear"></div>

  <a class="pull-left forgot-password">Forgot password?</a>
  <button class="pull-right" data-ember-action="1" type="button">Sign In</button>
</form>

【参考方案1】：

您最后一个input 不是最后一个孩子——那将是您的button。

使用:last-of-type 来选择最后一个input：

input 
  margin-bottom: 0px;

  &:last-of-type 
    margin-bottom: 10px;