Hoe div achtergrondkleur transparant maken in CSS

Ik'gebruik geen CSS3. Dus ik kan geen opacity of filter attributen gebruiken. Hoe kan ik zonder deze attributen te gebruiken de achtergrondkleur transparant maken van een div? Het zou een beetje moeten lijken op het tekstvak voorbeeld in deze link. Hier is de achtergrondkleur van het tekstvak transparant. Ik wil hetzelfde maken, maar dan zonder de bovengenoemde attributen te gebruiken.

Derek 朕會功夫
Bewerkte vraag 19de6 juli 2015 в 12:16
Programmering
html css background-color transparent
4de5 augustus 2012 в 8:57
18 views

Het probleem met opacity is dat het ook de inhoud zal beïnvloeden, terwijl je dat vaak niet wilt.

Als je alleen maar wilt dat je element transparant is, is het echt zo simpel als :

background-color: transparent;

Maar als je het in kleuren wilt, kun je gebruiken:

background-color: rgba(255, 0, 0, 0.4);

Of definieer een achtergrond afbeelding (1px bij 1px) opgeslagen met de juiste alpha.
(Gebruik daarvoor Gimp, Paint.Net of een andere afbeeldingssoftware waarmee je dat kunt doen.
Maak gewoon een nieuwe afbeelding, verwijder de achtergrond en zet er een semi-transparante kleur in, en sla het dan op in png).

Zoals gezegd door René, het beste zou zijn om beide te mixen, met de rgba eerst en de 1px bij 1px afbeelding als een fallback als de browser alpha niet ondersteunt:

background: url('img/red_transparent_background.png');
background: rgba(255, 0, 0, 0.4);

Zie ook : http://www.w3schools.com/cssref/css_colors_legal.asp.

Demo : [Mijn JSFiddle](http://jsfiddle.net/APSnL/68/)

Jerska
Bewerkt antwoord 4de4 augustus 2017 в 12:20
Commentaren (2)
Oplossing

Opaciteit geeft je doorschijnendheid of transparantie. Zie een voorbeeld [Fiddle hier][1].

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";       /* IE 8 */
filter: alpha(opacity=50);  /* IE 5-7 */
-moz-opacity: 0.5;          /* Netscape */
-khtml-opacity: 0.5;        /* Safari 1.x */
opacity: 0.5;               /* Good browsers */

Opmerking: dit zijn GEEN CSS3 eigenschappen

Zie http://css-tricks.com/snippets/css/cross-browser-opacity/

Adrien Be
Bewerkt antwoord 24ste0 februari 2014 в 11:35
Commentaren (12)

transparent is de standaard voor achtergrondkleur

http://www.w3schools.com/cssref/pr_background-color.asp

Commentaren (2)