Achtergrond transparant maken

[Mikeyboy93]

Ik heb mijn website op wordpress en nu wil ik dus net zoals op Hyves waar je de blokken doorzichtig kunt maken, dat wil ik dus ook op mijn site zodat je de achtergrond er een beetje wazig doorheen ziet. Nu heb ik dus het volgende

#headline {
width:590px;
float:left;
background: #FFFFFF;
padding:10px;
font-size:1.05em;
line-height:1.5em;
margin:0;
}

Nu heb ik background al veranderd naar transparant en dat lukt wel alleen krijg je het dan helemaal en ik wil graag iets van 50% ongeveer. Ik heb al genoeg op google gevonden maar ik word er niet echt wijzer van.
Natuurlijk wil ik wel dat het zowel als in IE ook in andere webbrowsers er goed uitziet.

 

[RoboticPro]

ik werk de laatste tijd veel emt css3 mischien dat deze functie de oplossing is :

http://www.css3.info/preview/opacity/

anders staan er ook nog andere voorbeelden van nieuwe codes.

 

[Mikeyboy93]

ik werk de laatste tijd veel emt css3 mischien dat deze functie de oplossing is :

http://www.css3.info/preview/opacity/

anders staan er ook nog andere voorbeelden van nieuwe codes.

ik word er eerlijk gezegd niet echt wijzer van.

 

[RoboticPro]

Ik ben toevallig net bezig met een voorbeeld website voor in mijn portfolio :

http://voorbeeld1.roboticprogrammer.com/Admin/

Dat doorzichtigheid effect heb ik gedaan door in de css het volgende tedoen

div#header {
background-color:white;
opacity:0.4;
}

Je kan van 0 tot 1 instellen 1 is niet transparant en 0 is volledig transparant
De achtergrond kleur geeft de kleur.

Ik hoop dat het nu wat duidelijker is.

PS. Deze code is niet ondersteund door Internet Explorer. (Nog niet)

Brian

 

[Mikeyboy93]

Ik ben toevallig net bezig met een voorbeeld website voor in mijn portfolio :

http://voorbeeld1.roboticprogrammer.com/Admin/

Dat doorzichtigheid effect heb ik gedaan door in de css het volgende tedoen

div#header {
background-color:white;
opacity:0.4;
}

Je kan van 0 tot 1 instellen 1 is niet transparant en 0 is volledig transparant
De achtergrond kleur geeft de kleur.

Ik hoop dat het nu wat duidelijker is.

PS. Deze code is niet ondersteund door Internet Explorer. (Nog niet)

Brian

Het werk inderdaad, helaas niet in IE dus dan doe ik het denk ik niet want bij mij word alles doorzichtig dan, zowel de foto in t bericht als de tekst. En ik wil graag de links en tekst zwart houden.. Misschien moet ik eventjes aanpassen dat t dan wel goed is. Dus ik ga proberen!

 

[Naarling]

Ik ben toevallig net bezig met een voorbeeld website voor in mijn portfolio :

http://voorbeeld1.roboticprogrammer.com/Admin/

Dat doorzichtigheid effect heb ik gedaan door in de css het volgende tedoen

div#header {
background-color:white;
opacity:0.4;
}

Je kan van 0 tot 1 instellen 1 is niet transparant en 0 is volledig transparant
De achtergrond kleur geeft de kleur.

Ik hoop dat het nu wat duidelijker is.

PS. Deze code is niet ondersteund door Internet Explorer. (Nog niet)

Brian

Opacity wil je niet hebben, dat maakt het hele element doorzichtig. Wat je wel kunt doen is een rgba kleur voor de achtergrond gebruiken (ook dit onderdersteund ondersteund het achterlijk IE natuurlijk weer niet) het werkt als volgt.

background-color:rgba(250, 0, 0, 0.5); Dat zet rood op maximaal, elemineert de andere kleuren en opacity op 50%
De eerste drie cijfers kun je dus veranderen om de kleur (de hoeveelheid Rood, Groen en Blauw) te wijzigen en het derde om de kleur meer of minder doorzichtig te maken.

EDIT: Wat je ook kunt doen, en wat in elk geval in IE7 en IE8 werkt is een klein png plaatje als achtergrond gebruiken, en dat steeds laten herhalen. PNG plaatjes kunnen transparant zijn.

 

[Mikeyboy93]

Opacity wil je niet hebben, dat maakt het hele element doorzichtig. Wat je wel kunt doen is een rgba kleur voor de achtergrond gebruiken (ook dit onderdersteund ondersteund het achterlijk IE natuurlijk weer niet) het werkt als volgt.

background-color:rgba(250, 0, 0, 0.5); Dat zet rood op maximaal, elemineert de andere kleuren en opacity op 50%
De eerste drie cijfers kun je dus veranderen om de kleur (de hoeveelheid Rood, Groen en Blauw) te wijzigen en het derde om de kleur meer of minder doorzichtig te maken.

EDIT: Wat je ook kunt doen, en wat in elk geval in IE7 en IE8 werkt is een klein png plaatje als achtergrond gebruiken, en dat steeds laten herhalen. PNG plaatjes kunnen transparant zijn.

Ik ga proberen dat met die PNG afbeelding.
Ik heb mijn achtergrond plaatje met photofiltre lichter gemaakt en toen dat plaatje als achtergrond gebruikt voor de ''vakken''. Dat wil wel, goed zelfs alleen sluit het niet echt helemaal mooi aan op mijn achtergrond.
Op deze manier wil het iig wel!