Arka plan rengi ve opaklığı mı ayırıyorsunuz? Bir yerde bir elementin bg rengini ayarlamak ve başka bir yerde olan donukluk işlemek için bir yol

Question

var mı? (Zaman onları düşündüren israf etmeyiniz)

bu şeffaf PNG veya bazı yığılmış DIV öğeleri ile yapılabilir biliyorum, ama bu seçenekleri kullanamaz.

CSS Dosyası Kısmi renk bileşenlerini belirlemek ve değerlerin dinlenmek için mümkün değil bir

#menubar { 
background-color: #036564; 
} 

CSS Dosya B

#menubar { 
background-color-opacity: 0.5; /* idea 1 */ 
background-color: rgba(inherit, inherit, inherit, 0.5); /* idea 2 */ 
} 

Answer 1

miras veya CSS kaskad. Eğer bir alfa değerine sahip bir renk belirtmek gerekirse bir alfa bileşeni belirtmek için izin sadece renk değerleri rgba() ve hsla() gibi

, sen alfa ile birlikte RGB veya HSL değerlerini sağlamak gerekir. Alfa'yı diğer renk bileşenlerinden bağımsız olarak belirleyemezsiniz.

Detaylar için CSS3 Color Module bakınız.

Answer 2

İki bölmeyi gerçekten bölebilirsiniz: background-color ve opacity, ancak bu durumda opacity yalnızca arka plan rengini değil, tüm öğeye uygulanır. jsfiddle örnekte

http://jsfiddle.net/tUHdv/

, mavi meydanda harfler hafif kızarıklık nasıl dikkat edin.

NOT: Bu cevabım background-color daha fazla etkiler sen hariç iki özelliğin birlikte kullanabileceği netleştirmek için eklenmiştir.

Answer 3

Eğer rgb renk için bir değişken tanımlamak ve sonra sadece alfa saydamlık bileşeni belirten bir RGBA renk takabilirsiniz Sass kullanın. Ayrı background-color saydamlığını neden istediğini

$base-color: rgb(200,150,100); 

a { 
    color: rgba($base-color, .7); 
} 

https://robots.thoughtbot.com/controlling-color-with-sass-color-functions