Transparent background and text over an image

[joelbrandman]

Can anyone help me by showing me how to achieve this style seen in the following URL,

http://www.bbc.co.uk/food/chicken

I would like to create the style seen in the provided example of an image with a transparent black box along the bottom with text which can be made into a link.(Avoiding using Photoshop)

Thank you.

[donna1]

In javascript there is a rgba function to set colours
the a value is transparency so set that to half of max

dont know if theres the same sort of thing in CSS

[backa]

the rgba function exists in css too. rgba(0, 0, 0, .5) will set the colour as black with 50% transparency. the final value set in increments of .1 determines the opacity.

[joelbrandman]

Thank you, how do I get it to overlay an image though?

[donna1]

in javascript just set that rgba opacity in style before any draw to the canvas and then it does it automatically,
in CSS I think you put opacity:0.5

[donna1]

Ive just tried it on the hydra example and opacity is not really what I need for games moving over a background
I want surrounding white in the hydra image to be transparent.
Heres the example with a background and opacity of object set to 0.5 you can see the problem - HELP

http://donoi.hostoi.com/hydrabck.html