4

プロパティがまだ に設定されていない場合にのみdisplayプロパティを に設定する mixin を定義したいとします。inline-block block

これは架空の例です(そのunless部分が有効なSASSではないことに気づきました。それが私が求めていることです):

@mixin padded
  padding: $default-padding-y $default-padding-x
  display: inline-block unless(block)

これは可能ですか?

4

1 に答える 1

2

この状況に対処する方法は次のとおりです。CSS プロパティの順序が重要であるという事実を利用します。したがって、ミックスインでディスプレイをインラインブロックとして定義します。あなたの要素でそれを呼び出します。次に、その呼び出しの下でディスプレイをブロックに設定し、ミックスインをオーバーライドします。

@mixin padded
  padding: $default-padding-y $default-padding-x
  display: inline-block

.element
  @include padded
  display: block

まさにこの理由から、私は通常、ルールセットの先頭で mixins (または extends) を呼び出します。

または、インライン ブロック スタイルを動的に追加する場合は、JavaScript を使用して要素が持つ表示プロパティを確認し、それに応じて新しいクラスを適用できます。これには Sass mixin は必要ありません。

于 2013-08-15T03:20:17.003 に答える