web-dev-qa-db-ja.com

sass:最初の子が機能していません

SASSを長い間使用していないので、:first-child:last-childなどの擬似要素に問題があるかどうかを知りたいと思いましたか?

25
ApPeL

@Andreは、特に古い(IE)ブラウザーでは、擬似要素とそのサポートに問題があることは正しいですが、そのサポートは常に改善されています。

あなたの質問については、問題はありますか?私は本当に見たことがないと思いますが、特に最初にそれを使い切るとき、擬似要素の構文は少し難しいかもしれません。そう:

div#top-level
  declarations: ...
  div.inside
    declarations: ...
    &:first-child
      declarations: ...

予想どおりにコンパイルされます:

div#top-level{
  declarations... }
div#top-level div.inside {
  declarations... }
div#top-level div.inside:first-child {
  declarations... }

「sassはcssができることをすべて行うことができる」という声明を除いて、これに関するドキュメントを見たことはありません。いつものように、HamlとSASSではインデントがすべてです。

44
nomadkbro

使用する方が良いと思います(私の経験上)_:first-of-type_、:nth-of-type()、_:last-of-type_。ルールを少し変更するだけで実行できますが、_*-of-type_セレクターよりも_*-child_セレクターよりもはるかに多くのことができました。

12
IGRACH

まず第一に、まだこれらの擬似要素をサポートしていないブラウザ(つまり、:first-child、:last-child)が存在するため、この問題に「対処」する必要があります。

擬似要素を使用せずにそれを機能させる良い例があります:

http://www.darowski.com/tracesofinspiration/2010/01/11/this-newbies-first-impressions-of-haml-and-sass/

-仕切りパイプの例を参照してください。

これが役に立てば幸いです。

0
Andrei Sfat