使用最后一子选择器的CSS少(less css using last-child selector)

2019-09-02 02:12发布

我用的less ,并试图让过去的输入有一个边距 10px 。 这里是我有什么,但它不工作,并在最后输入不应用下边距。 任何想法,为什么?

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>

Answer 1:

你的最后一个input是不是最后一个孩子-这将是你的button

使用:last-of-type ,而不是选择最后input

input {
  margin-bottom: 0px;

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


文章来源: less css using last-child selector