色を渡さずにボックスの影を変更する方法はありますか？

Question

ここは私の問題です。私は2つのCSSクラスを持って、私の要素はどちらか

.classA{box-shadow:inset -2px 0px 0px 0px rgba(63,191,31,1);} 
.classB{box-shadow:inset -2px 0px 0px 0px rgba(204,29,29,1);} 

私はインセットではなく、カラー作品

.classC{box-shadow:inset -10px 0px 0px 0px;} 

を変更するために第三のクラスを使用することができます（影がここにある）が、色は黒に変わります。私は元の色を維持したいと思います。

を使用してシャドウプロパティを変更するにはCSSを使用する場合、色を失うことなくのみを使用しますか？

Answer 1

ボックスシャドウは、たとえば境界缶のような部品に分割することはできません。しかし、あなたが使うことができるトリックは、box-shadowがその要素のcolor属性からその色を継承するということです。

<div class="box"> 
</div> 

<div class="shadow box"> 
</div> 

.box{ 
    box-shadow: 0 0 10px; 
    width: 100px; 
    height: 100px; 
    margin: 10px; 
    background: #fff; 
} 

.box.shadow{ 
    color: rgba(255,0,0,.3); 
} 

http://jsfiddle.net/82z8r73o/