Màu nền CSS trong suốt

Question

Tôi muốn làm cho menu danh sách biến mất bằng cách sử dụng độ mờ mà không ảnh hưởng đến phông chữ. Có thể với CSS3?

Answer 1

hey bây giờ bạn có thể sử dụng rgba trong thuộc tính css như như thế này

.class{ 
background:rgba(0,0,0,0.5); 
} 

0,5 là minh bạch bây giờ bạn có thể thay đổi theo thiết kế của bạn.

sống bản demo thông tinhttp://jsfiddle.net/EeAaB/

hơnhttp://css-tricks.com/rgba-browser-support/

Answer 2

vâng, đó là có thể. chỉ cần sử dụng rgba-syntax cho màu nền của bạn.

.menue{ 
    background-color: rgba(255, 0, 0, 0.5); //semi-transparent red 
} 

Answer 3

Hãy thử điều này:

opacity:0; 

Đối với IE8 và trước đó

filter:Alpha(opacity=0); 

Opacity Demo from W3Schools

Answer 4

Trong trường hợp này background-color:rgba(0,0,0,0.5); là cách tốt nhất. Ví dụ: background-color:rgba(0,0,0,opacity option);

Answer 5

Giữ ba tùy chọn trong tâm trí (bạn muốn # 3):

1) Tổng số các phần tử là minh bạch:

visibility: hidden; 

2) Tổng số các yếu tố có phần minh bạch:

opacity: 0.0 - 1.0; 

3) Chỉ cần nền của phần tử trong suốt:

background-color: transparent; 

Answer 6

Dưới đây là một lớp ví dụ sử dụng CSS tên màu:

.semi-transparent { 
    background: yellow; 
    opacity: 0.25; 
} 

này thêm một nền đó là đục 25% (màu) và 75% trong suốt.

caveat Thật không may, opacity sẽ ảnh hưởng sau đó toàn bộ yếu tố nó gắn liền với.
Vì vậy, nếu bạn có văn bản trong phần tử đó, nó cũng sẽ đặt văn bản thành độ mờ 25%. Vì vậy, trong hầu hết các trường hợp, bạn cần sử dụng các phương pháp rgba hoặc hsla để chỉ rõ độ trong suốt của nền, mà không ảnh hưởng đến độ trong suốt của mọi thứ trong phần tử của bạn.

Dưới đây là 3 cách để thiết lập một nền màu xanh ở 75% tính minh bạch:

• background: rgba(0%, 0%, 100%, 0.75)
• background: rgba(0, 0, 255, 0.75)
• background: hsla(240, 100%, 50%, 0.75)