Som besökare på Hamsterpaj samtycker du till användandet av s.k. cookies för att förbättra din upplevelse hos oss. Jag förstår, ta bort denna ruta!
Annons

Transparent div

Skapad av Lollaren, 2011-04-22 02:42 i Webbutveckling & Programmering

1 529
12 inlägg
0 poäng
Lollaren
Visningsbild
P 27 Gävle Hjälte 1 441 inlägg
0
Hur gör jag om jag vill ha en div som har transparent bakgrund, och sen vill jag ha en till div i den diven, som inte har transparent bakgrund utan grå bakgrund bara?
Får det inte riktigt att fungera.

.div1 {
margin-top:3px;
width:1000px;
height:900px;
border: 5px black solid;
filter:alpha(opacity=50);
opacity:0.5;
background:white;
margin:1px auto;
-moz-border-radius: 5px;
border-radius: 5px;
}



.div2 {

border:2px black solid;
width:680px;
float:right;
margin:10px;
background:grey;
}
Vad kan vara fel? Hur ska jag göra?

Kodapa

Är reklamen ivägen? Logga in eller registrera dig så försvinner den!

Patrikp
Visningsbild
P 28 Karlskrona Hjälte 1 187 inlägg
0

Svar till Lollaren [Gå till post]:
Ingen aning, men GÖR ERAN HEMSIDA RAAAAK :D

HareKrishnas gud sedan 2014

Syndafloden
Visningsbild
P 33 Karlstad Hjälte 10 705 inlägg
0
Opacity är en helt värdelös funktion, då den gör alla childs transparenta också. Det du kan göra är att du använder färgvärdet rgba(); och/eller en transparent bild.

Så släng upp photoshop, och gör en liten, liten bild som är den färgen du vill ha den, men transparens. Döp den till vad du vill och spara.

Så om du ska köra en vit transparent background kör du helt enkelt, i Photoshop då:
Nytt dokument
5px höjd
5px bredd
bakgrundsfärg vit
SEdan ställer du ned opacity-reglaget i lagerpaletten till 50%.
spara som .png.

När du har bilden sparad så smäller du in följande kod istället för opacity.


background: url(dinbild.png);
background: rgba(255,255,255,.5);

Så ska det funka.

HEH, TIME FOR A BIT OF A ROUGH AND TUMBLE

Lollaren
Visningsbild
P 27 Gävle Hjälte 1 441 inlägg
Trådskapare
0

Svar till Erotisk_Eruption [Gå till post]:
Tack så mycket :)

Kodapa

Lollaren
Visningsbild
P 27 Gävle Hjälte 1 441 inlägg
Trådskapare
0

Svar till Patrikp [Gå till post]:
Den är rak?

Kodapa

enji
Visningsbild
P 30 Arvika Hjälte 509 inlägg
0

Svar till Lollaren [Gå till post]:
-moz-border-radius är outdated, Mozilla kör med standarden border-radius !

Jag är en dålig förlorare! ;)

Patrikp
Visningsbild
P 28 Karlskrona Hjälte 1 187 inlägg
0

Svar till Lollaren [Gå till post]:
*centrerad

HareKrishnas gud sedan 2014

pr0n
Visningsbild
P Hjälte 5 588 inlägg
0

Svar till Lollaren [Gå till post]:
Du kan inte ha saker i diven som är transparent. Då kommer innehållet också blir det. Istället får du använda dig av fler element och fixa positionen av elementen.

http://css-tricks.com/non-transparent-elements-inside-transparent-elements/

Ingen status

Lollaren
Visningsbild
P 27 Gävle Hjälte 1 441 inlägg
Trådskapare
0

Svar till Erotisk_Eruption [Gå till post]:
Dock funkar inte detta i IE :(

Kodapa

Lollaren
Visningsbild
P 27 Gävle Hjälte 1 441 inlägg
Trådskapare
0

Svar till Vufuzi [Gå till post]:
Hmm, använder båda för eventuella webbläsare som inte klarar border radius utan för med moz

Kodapa

Syndafloden
Visningsbild
P 33 Karlstad Hjälte 10 705 inlägg
0

Svar till Lollaren [Gå till post]:
Näh, inte rgba();

Men enbart en transparent bakgrundsbild ska funka.

HEH, TIME FOR A BIT OF A ROUGH AND TUMBLE

Lollaren
Visningsbild
P 27 Gävle Hjälte 1 441 inlägg
Trådskapare
0

Svar till Erotisk_Eruption [Gå till post]:
Får väl testa det då :p

Kodapa


Forum » Datorer & IT » Webbutveckling & Programmering » Transparent div

Ansvariga ordningsvakter:

Användare som läser i den här tråden just nu

1 utloggad

Skriv ett nytt inlägg

Hej! Innan du skriver om ett potentiellt problem så vill vi påminna dig om att du faktiskt inte är ensam. Du är inte onormal och världen kommer inte att gå under, vi lovar! Så slappna av och gilla livet i några minuter - känns det fortfarande hemskt? Skriv gärna ner dina tankar och frågor, vi älskar att hjälpa just dig!

Den här tråden är äldre än Rojks drömtjej!

Det senaste inlägget i den här tråden skrevs för över tre månader sedan. Är du säker på att du vill återuppliva diskussionen? Har du något vettigt att tillföra eller passar din fråga i en ny tråd? Onödiga återupplivningar kommer att låsas så tänk efter en extra gång!

Hjälp

Det här är en hjälpruta

Här får du korta tips och förklaringar om forumet. Välj kapitel i rullningslisten här ovanför.

Rutan uppdateras automagiskt

När du använder funktioner i forumet så visas bra tips här.


Annons
Annons
Annons
Annons