webForumDet fria alternativet

Transparant bakgrund i tabell!

HTML & CSS

10 svar · 949 visningar · startad av d@le

Medlem sedan juni 2001329 inlägg
Frågan#1

Hej,

skulle vilja ha en transparant bakgrund i ett par av mina tabeller. Har sökt på forumet och fått fram två alternativ, men får de inte till att fungera, den första gjorde ju allting i tabellen 50% eller de alternativ man valt, även om jag försökte koda bort den och lägga den i en td för sig och sen en tabell i tabellen där texten låg. Den andra kodsnutten får jag inte att fungera överhuvudtaget, och den ser ut enligt följande:

<style type="text/css">

#divMedHalvtransparens{
background:transparent;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sr c="images/osynlig.png",sizingMethod="scale");

</style>

<td width="200" height="100%" id="divMedHalvtransparens" valign="top">
<table align="top" border="0" cellpadding="4" cellspacing="0">
<tr valign="top"><td><font face="trebuchet MS" color"black"><b>jdjdjdjdjdjdj</b></font></td></tr>
</table></td>

Bilden är sparad i Photoshop som en vit bild, med genomskinlighet, png formatet, såsom det stog i inlägget att man skulle göra.

Tacksam för all hjälp!

Medlem sedan juni 2001329 inlägg
#2

Ingen som har ett länktips eller liknande? Har provat googla och söka på forumet, men det enda jag fått upp har jag som sagt försökt med, dock utan resultat. Någon?

Medlem sedan apr. 2006409 inlägg
#3

Varför vill du göra en tabell transparant..?

Kan du inte div:a upp bilden som en bakgrund i stället? Då kan du använda opacity: 0.2; eller filter: alpha(opacity=20); Hmm, det funkar kanske på vanliga bilder ochså... Nåja, du kan väl testa i alla fall.

/p

Medlem sedan juni 2001329 inlägg
#4

Låter jättebra, men hur ska jag skriva för att det ska fungera?

Medlem sedan juni 2001329 inlägg
#5

Oj, glömde, du undra anledningen, jo, bakgrunden på hemsidan ska vara Matrixaktigt, men för att texten ska kunna synas, vill jag ha exempelvis en vit bakgrund på tabellerna, men ändå så att jag kan se bakgrunden igenom, samtidigt som jag kan läsa den text som kommer skrivas på hemsidan... förstår du vad jag menar? ;)

Medlem sedan apr. 2006409 inlägg
#6

I din css-fil:
#box1 {width: 500px; height: 500px; background: #aaa; position: absolute; top: 50px; left: 50px; opacity: 0.5; filter: alpha(opacity=50); z-index: 1;}
#box2 {width: 500px; height: 500px; background-image: url(dinbakgrund.gif) position: absolute; top: 50px; left: 50px; z-index: 0;}

I din html:
<div id="box1"></div>
<div id="box2">Text eller vad det nu är som ska synas igenom box1.</div>

Här är ett snabbt förslag på hur du kan göra mha ett stylesheet. Testa och se vad du tycker. färgen #aaa ger kanske fel känsla, jag vet inte riktigt hur en matrixaktig sak ser ut. ;-)

Medlem sedan aug. 20039 340 inlägg
#7

Pröva detta:

<html>
<head>

<style type="text/css">

body{background-color: black;}
.transpcell{background-color: transparent;
background-image: url('white-50.png');}
</style>

<!--[if gt IE 5.5]>
<style type="text/css">
.transpcell{background-image: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src="white-50.png",sizingMethod="scale");}
</style>
<![endif]-->

</head>
<body>

<table>
<tr><td class="transpcell">
Foo bar... td med class="transpcell"
</td></tr>
</table>

<br />
<div class="transpcell" style="width:95%"><!-- Du måste sätta width till något för att det ska funka på en div i IE -->
Foo bar... div med class="transpcell"
</div>

</body>
</html>
Medlem sedan aug. 20039 340 inlägg
#8

Och här är filen white-50.png. En fil som är fylld med färgen #ffffff med 50% transparens. Gör övrigen filen lite större än 1*1 pixel, t ex 10*10 pixlar, eftersom IE ibland kan rendera en stretchad 1*1-pixels bild lite långsamt.
/r Det blev ingen länk där inte... Man får ta och högerklicka på bilden och välja Spara bild som!

white-50.png
Medlem sedan juni 2001329 inlägg
#9

Tackar så hjärtligt, fungerar kanon! :)

Medlem sedan maj 2001797 inlägg
#10

Hur gör man en png-bild transparent? Försökte i Photoshop med 'Save for web' bl a, det verkade rimligt, men jag lyckas inte.

Medlem sedan maj 2001797 inlägg
#11

Hähä, det var ju inge svårt, bara att göra ett lager vitfärgat och sänka opaciteten på det lagret och därefter spara för web med bibehållen genomskinlighet. :r

272 ms totalt · 4 externa anrop · v20260731065814-full.a51de22e
128 ms — deklarationer (db)
0 ms — hämta statistik (cache)
140 ms — hämta tråd, inlägg och bilagor (db)
129 ms — ändringar (db)