[Typo3] Image background...
Eirik Wulff
eirik at wulff.biz
Wed Sep 28 23:07:04 CEST 2005
Kristian Wind wrote:
> Hi Peter,
>
> I have no idea how to. Please explain...
Opacity is a difficult word for non-transparency, so if you set a CSS
DIV-class to:
DIV.sixty-forty
{
opacity: .4;
filter: alpha(opacity=40);
}
Ex.: <div class="sixty-forty">content...etc</div>
it gives you content with 40% opactiy (which means 60% transparency). So
if only the images inside DIV.sixty-forty should not be transparent, it
means that their opacity should be 1.0. This can be accomplished in CSS
by making a new selector (= all img tags within DIV.sixty-forty):
DIV.sixty-forty IMG
{
opacity: 1.0;
filter: alpha(opacity=100);
}
Ex.: <div class="sixty-forty"><img src="..."> content... etc...</div>
...OR by making a CSS class for the images:
.not-transparent
{
opacity: 1.0;
filter: alpha(opacity=100);
}
Ex.: <img class="not-transparent" src="...">
1.0 is the default value for opacity, hence making standard objects
non-transparent.
The brilliance of CSS is that it (mostly) will inherit properties from
its surrounding CSS-code (Cascading is just that), and that objects
inside other objects may override its properties by setting them to
another value. There are some differences between IE and the other
browsers that force you to use different code to accomplish a single
task (hence both 'filter' and 'opacity' in the example)
There is a nice CSS tutorial on http://www.w3schools.com/css/
Regards,
E. Wulff
More information about the TYPO3-english
mailing list