0

ドキュメントによると、次のようなことをすると:

.child, .sibling {
    .parent & {
        color: black;
    }
    & + & {
        color: red;
    }
}

次のようなルールを取得する必要があります。

.parent .child,
.parent .sibling {
    color: black;
}
.child + .child,
.child + .sibling,
.sibling + .child,
.sibling + .sibling {
    color: red;
}

だから私は似たようなことをしています:

table {
  width: 100%;
  td, th {
    text-align: right;
    & + & {
      text-align: left;
    }
  }
}

しかし、それは機能していません。なぜそうしないのかについてのアイデアはありますか？

デモ

4

1 に答える 1

3

http://winless.org/online-less-compilerを使用すると、私にとっては完全に正常に動作します。これは出力です。

table {
  width: 100%;
}
table td,
table th {
  text-align: right;
}
table td + table td,
table td + table th,
table th + table td,
table th + table th {
  text-align: left;
}

& + &問題は、作成された機能を誤って使用していることだと思います。これは、前の兄弟がwho has anancer であるという祖先を持っている人にtable td + table td変換されます。thtabletdtable

table td + th, ...を使用して何をすべきかを意味していると思います+ th, + td

table {
  width: 100%;
  td, th {
    text-align: right;
    + th, + td {
      text-align: left;
    }
  }
}

プロデュース:

table {
  width: 100%;
}
table td,
table th {
  text-align: right;
}
table td + th,
table th + th,
table td + td,
table th + td {
  text-align: left;
}

明確にするために、あなたが思ったように機能しない理由&は、現在のセレクターを表し、 「現在の」セレクターの前のすべても含むためです。

于 2013-11-06T19:33:24.177 に答える