Inherit Bootstrap düğmesi degrade rengiyle çevreleyen alandan gelen metin rengi

Question

MVC, ASP.NET ve Twitter Bootstrap kullanarak bir web sayfası tasarlıyorum. Metin divan rengini çevreleyen div arka plan renginden miras alan bir düğme oluşturmak istiyorum. CSS stilini color: transparent gibi ayarladığımda, metin, düğmeyle aynı renkte olduğundan okunamaz.

Bunu CSS'de yapmanın bir yolu var mı, yoksa bunu başarmak için JS veya jQuery kullanmalı mıyım?

.red { 
 
    position: relative; 
 
    width: 200px; 
 
    height: 200px; 
 
    border: 1px solid black; 
 
    background: -webkit-linear-gradient(left, red 33%, #FFFFFF 66%); /* For Safari 5.1 to 6.0 */ 
 
    background: -o-linear-gradient(left, red 33%, #FFFFFF 66%); /* For Opera 11.1 to 12.0 */ 
 
    background: -moz-linear-gradient(left, red 33%, #FFFFFF 66%); /* For Firefox 3.6 to 15 */ 
 
    background: linear-gradient(left, red 33%, #FFFFFF 66%); /* Standard syntax (must be last) */ 
 
} 
 

 
.custom { 
 
    position: absolute; 
 
    border: 1px solid black; 
 
    top: 70px; 
 
    left: 70px; 
 
    background-color: orange; 
 
}

<div class="red"> 
 
<button class="btn custom" type="input"> 
 
Button 
 
</button> 
 
</div>

Answer 1

bunu kullanın jQuery kodu:

var divColor = $(".red").css("backgroundColor"); 

$(".custom").css("color", divColor);