English 中文(简体)
Non transparent image in transparent block
原标题:

logo_area

{
background-color: #d9e670; 
filter:alpha(opacity=25);
opacity:0.25;
}

and another div:

#logo_image
{
background: url(../images/logo.png) no-repeat center 50%;
}

<div id="logo_area">
  <div id="logo_image"></div>
</div>

Of course, logo_image is transparent too. Could I make it untrensparent in transparent block?

最佳回答

I don t think so. I am not sure if it s possible to bring it to 100% transparent if the container isn t.

However, what you can do is put it outside the block, such as:

<div id="logo_image"></div>
<div id="logo_area">
</div>

Then on the logo image block, add:

#logo_area
{
    position: absolute;
    height: x;
    width: y;
}

So it should sit on top of the logo area div, but not be part of it. You may need to set the height of the logo area though, as the logo image will not cause it to stretch.

问题回答

暂无回答




相关问题
CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

image changed but appears the same in browser

I m writing a php script to crop an image. The script overwrites the old image with the new one, but when I reload the page (which is supposed to pickup the new image) I still see the old one. ...

Firefox background image horizontal centering oddity

I am building some basic HTML code for a CMS. One of the page-related options in the CMS is "background image" and "stretch page width / height to background image width / height." so that with large ...

Separator line in ASP.NET

I d like to add a simple separator line in an aspx web form. Does anyone know how? It sounds easy enough, but still I can t manage to find how to do it.. 10x!

热门标签