5

私のHTMLは次のようになります。

<div class=chocolateSandwich>
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
</div>

したがって、アイテム5を最も目立たないIE不透明度.1にし、アイテム1を不透明度1または.9と言うようにします。ハードコーディングされたそれぞれの子番号の値に基づいて、明らかにそれを行うことができますが、 CSSには、オブジェクトの数を指定して、より低い不透明度の値を適用すると言う方法があります。

洗練されていない解決策は、cssルールを使用することです。

.chocolateSandwich:nth-child(4) { opacity:.1 }
.chocolateSandwich:nth-child(3) { opacity:.3 }
.chocolateSandwich:nth-child(2) { opacity:.5 }
.chocolateSandwich:nth-child(1) { opacity:.7 }
.chocolateSandwich:nth-child(0) { opacity:.9 }
4

1 に答える 1

1

これはCSSだけでは達成できず、LESS CSSを使用でき、これは非常に簡単になります。LESS CSSを使用したくない場合は、JavaScriptまたはjQueryを使用できます。

ここにリンクがあります:http://lesscss.org/

あなたがそれを理解できないならば、私に知らせてください、そして、私はLESSでコードを書きます。

幸運:D

于 2012-11-29T19:36:19.500 に答える