Transparent div

Tags:    html css

Hej.
Jeg arbejder for tiden sammen med en grafiker om at lave en hjemmeside for Dragoer Kirke. Problematisk har grafikeren bare kommet med et design jeg ikke helt kan gennemskue hvordan implementeres. Se forslaget her:
http://www.shafh.dk/1.pdf

Som i ser går mange bokser over selve footeren, og som i ser, sker der nærmest sådan en transparent farveændring.

Nu vil jeg gerne holde siden så dynamisk som muligt. Så hvordan gør jeg dette bedst? Er der nogen der har et foreslag?



8 svar postet i denne tråd vises herunder
3 indlæg har modtaget i alt 3 karma
Sorter efter stemmer Sorter efter dato
Jeg ville nok bare lave det som halvtransparente png billeder, og der hvor IE så for problemer er der så ikke noget at gøre ved det.



Indlæg senest redigeret d. 10.11.2010 23:37 af Bruger #10216
Du kan lave det med opacity og så bare bruge den farve du vil have som background.
Derefter få sat kasserne i rigtig rækkefølge med z-index.
Dog får du nok nogle problemer med at få teksten til at stå skarpt efter dette.
Dog kan du løse det på et anden måde ved at indføre en div med 2 divs indeni. en med baggrund og en med tekst.



Hej.
Jeg arbejder for tiden sammen med en grafiker om at lave en hjemmeside for Dragoer Kirke. Problematisk har grafikeren bare kommet med et design jeg ikke helt kan gennemskue hvordan implementeres. Se forslaget her:
http://www.shafh.dk/1.pdf

Som i ser går mange bokser over selve footeren, og som i ser, sker der nærmest sådan en transparent farveændring.

Nu vil jeg gerne holde siden så dynamisk som muligt. Så hvordan gør jeg dette bedst? Er der nogen der har et foreslag?


Du vælger det område du vil påvirke og laver så en style der passer -med de nye teknikker kan du bruge denne klasse jeg laver her

.transparent
{
filter:alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
}

alpha bruges til xplore
moz til de andre browsere -

du kan nu lave dine ting transparent



Bha.... Findes der ingen bedre løsning?



Eller lave en boks med een baggrundsfarve og derefter brugt et billede til at lave nr. 2 baggrundfarve.



Frygter bare problemer med at få det til at se ordenligt ud på forskellige browsers...



du kan også vælge en div og bruge den

<div style="filter:alpha(opacity=50); opacity:0.5;">........</div>

hvis du vil tilføje farve kan du bruge rgb værdier fks:

<div style="background-color: rgba(255, 0, 0, 0.5)">………</div>




Tja argh... Det er CSS3. Det er ikke understøtter nok til at jeg tør bruge det.

Nå men har lavet en løsning, på den hård måde.
Se det evt. på www.dragoerkirke.dk

Men tak for hjælpen folkens



t