Less.js: :first-child 伪类不适用于扩展

创建于 2016-02-11 · 7评论 · 资料来源: less/less.js

我正在使用以下代码：

header {
    &:extend(.menu all);
}

在less文件中，我有以下结构：

.menu {// CODE}
.menu:after {// CODE}
.menu:first-child {// CODE}
.menu:last-child {// CODE}

在输出文件中，.menu 和 . 菜单：出现后。但不是 . 菜单：第一个孩子或。菜单：最后一个孩子。

但是，如果我更改 . 菜单：第一个孩子或。 menu:last-child to . 菜单：第一和。 menu:last然后 css 代码会显示出来。

似乎连字符是问题所在。

知道如何解决这个问题吗？

谢谢。

consider closing needs info

资料来源

moshemo

所有7条评论

我无法确认您的结果： demo 。
从您在 SO 的问题中我可以看出您正在使用gulp-less ，但是由于我真的记不起任何具有此类错误的 Less 版本（从 1.4.x 开始），因此很可能不是一种“不是最近较少或无吞咽版本”的问题。所以问题是：你确定这个_is_是你遇到问题的片段（也许它更复杂？），和/或它可能是其他一些可能干扰的gulp任务吗？

seven-phases-max 于 2016-02-11

也许这是一个吞咽任务。我明天或下周初会研究一下。谢谢。

moshemo 于 2016-02-11

也许这会有所帮助。

ivan-nikitovic 于 2016-03-13

😕3

由于不活动而关闭（无论如何似乎不是 Less 问题）。

seven-phases-max 于 2016-04-17

@seven-phases-max 我相信上面提供的代码完全重现了这个问题。

较少的

.col {
  float: left;

  &:last-child {
    margin-right: 0;
  }
  &:first-child {
    margin-left: 0;
  }
}

.generate-columns(<strong i="9">@n</strong>, <strong i="10">@i</strong>: 1) when (<strong i="11">@i</strong> =< @n) {
  .col-@{i}:extend(.col) {
    margin-left: (@i)px;
  }

  .generate-columns(<strong i="12">@n</strong>, (<strong i="13">@i</strong> + 1));
}

.generate-columns(2);

生成的css

.col,
.col-1,
.col-2 {
  float: left;
}
.col:last-child {
  margin-right: 0;
}
.col:first-child {
  margin-left: 0;
}
.col-1 {
  margin-left: 1 px;
}
.col-2 {
  margin-left: 2 px;
}

预期的CSS：

.col,
.col-1,
.col-2 {
  float: left;
}
.col:last-child {
  margin-right: 0;
}
.col:first-child {
  margin-left: 0;
}
.col-1 {
  margin-left: 1 px;
}
.col-1:last-child {
  margin-right: 0;
}
.col-1:first-child {
  margin-left: 0;
}
.col-2 {
  margin-left: 2 px;
}
.col-2:last-child {
  margin-right: 0;
}
.col-2:first-child {
  margin-left: 0;
}

遗失的部分

.col-1:last-child {
  margin-right: 0;
}
.col-1:first-child {
  margin-left: 0;
}
.col-2:last-child {
  margin-right: 0;
}
.col-2:first-child {
  margin-left: 0;
}

ivan-nikitovic 于 2016-04-17

@ivan-nikitovic 不，看看extend和extend all之间的区别。

seven-phases-max 于 2016-04-17

@seven-phases-max 这有道理。 :-) 感谢您的参考。

ivan-nikitovic 于 2016-04-17

此页面是否有帮助？

0 / 5 - 0 等级

Less.js: :first-child 伪类不适用于扩展

所有7条评论

相关问题