Setting Element Opacity

opacity property sets the transparency of an element.

The allowed range for opacity property is from 0 to 1. 0 means completely transparent. 1 means completely opaque.

 
<!DOCTYPE HTML> 
<html> 
    <head> 
        <title>Example</title> 
        <style> 
            p { 
                padding: 5px; 
                border: medium double black; 
                background-color: lightgray; 
                font-family: sans-serif; 
            } 
            #myID { 
                font-size: x-large; 
                border: medium solid white; 
                background-color: green; 
                color: white; 
                opacity: 0.4; 
            } 
            a:hover { 
                color: red; 
            } 
        </style> 
    </head> 
    <body> 
        <p> 
            <span id="myID">CSS</span>
            This is a test.
            <a href="http://java2s.com">java2s.com</a> 
        </p> 
    </body> 
</html>

Click to view the demo

Home
HTML CSS Book
CSS

Foreground Color Opacity: