I want to create a webpage with transparent background, a table and some text. I have seen posts related to this, but due to my lack of familiarity with css, I somehow cant get my code to work. I just want a transparent background, while this code is making everything transparent. Can someone kindly help.
<html>
<head><style type="text/css">
div.transbg {background-color:#4a6c9b; opacity:0.6;}
</style></head>
<div class="transbg">
<body><Center><font color="#FFFFFF">
<b>Toll Charges</b>
<table bgcolor="#000000" cellspacing=3>
<tr>
<td bgcolor="#009900"><font color="#FFFFFF" align="left"> Class 2 inc Private </font></td>
<td bgcolor="#009900"><font color="#FFFFFF" align="right"> A$ 4.95 </font></td>
</tr>
<tr>
<td bgcolor="#009900"><font color="#FFFFFF" align="left"> Class 2 inc Commercial </font></td>
<td bgcolor="#009900"><font color="#FFFFFF" align="right"> A$ 13.95 </font></td>
</tr>
</table>
<br>
Toll has to be paid within 48 hrs of passage, else an additional A$ 13.95 of administration charges would be added
</font></Center>
</div>
</body>
</html>
Update
Great thanks for all the answers people. I have solved the problem in another way for the moment. Actually, I writing an iPhone app which uses Webview to display some html. I wanted to give webview a transparent look, which can be achieved by setting the alpha for the webview itself in interface builder. It kinda saying, make my entire web browser 50% transparent. I would like to thank everyone for their help here.
I suggest using rgba instead of opacity, thusly:
.transbg {background: rgba(red,green,blue,opacity);}
You can also put the rest of your formatting into CSS like this:
body {background-color:#000;
color:#fff;}
td {background-color: #090;
color:#fff;}
.leftc {text-align:left;}
.rightc {text-align:right;}
table {borderspacing: 3;}
Now you can remove the font tags and the attributes of td. All you'd need for td is <td class="leftc">
or with the rightc
class for text to the right.
See also http://css-tricks.com/rgba-browser-support/
I believe you're looking for this,
.transbg {
background-color:#4a6c9b;
filter:alpha(opacity=60);
-moz-opacity:0.6;
-khtml-opacity: 0.6;
opacity: 0.6;
}
and maybe this http://css-tricks.com/rgba-browser-support/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With