[Mini-tut][CSS]Przeźroczyste tło z zaokrąglonymi rogami

[bnmbb]

Jeśli chcemy zrobić przeźroczyste tło zazwyczaj sięgamy po program graficzny i tworzymy odpowiedni "prostokąt" o zaokrąglonych rogach prawda ?

Ale jak to zrobić łatwo w CSS :

Jeśli już ktoś to próbował zrobić na pewno zetknął się z komendami "opacity" i "filter". Obie te komendy są dobre lecz używając ich odnosi się to do wszystkiego co w tym elemencie jest i niestety mija się z celem . A więc jak zrobić półprzeźroczyste czarne tło-prostokąt z zaokrąglonymi rogami (dajmy 20px).

Proste. Do tego posłużą nam komendy "border-radius" ,która zaokrągli wszystkie rogi i zapis RGBA (Red, Green, Blue, Alpha).

.moja_klasa {
background-color: rgba(0, 0, 0, 0.5);
border-radius: 20px;
/* A może troche przeźroczysty biały tekst ? (tak na 70% widoczności)  Proszę bardzo :
color: rgba(255, 255, 255, 0.7);
}

 

Mam nadzieję ,że komuś pomogłem jako ,że sam miałem z tym problem.

[KDKJ]

Dzięki! Kiedyś o tym wiedziałem a ostatnio się męczyłem z grafiką

[Xiado]

Może się czepiam, ale - zamknij komentarz

[bartek93]

ten kod nie działa na wszyskich przeglądarkach

[cxxus]

To jest opcja, jeżeli się nie mylę z CSS3, a obsługi np. w IE tego nie ma. Tak jak @up - nie na każdej przeglądarce to działa.

 

@cd. opcji - to sam korzystam.

[bnmbb]

W IE 8 i wcześniej chyba . Tak to jest :

filter: alpha(opacity=40); - Jakoś tak to było .