CSS Opacity / Transparency CSS
- CSS Introduction
- CSS Selectors
- How To Add CSS
- CSS Colors
- CSS Backgrounds
- CSS Borders
- CSS Margins
- CSS Padding
- CSS Height and Width
- CSS Outline
- CSS Text
- CSS Fonts
- CSS Links
- CSS Lists
- CSS Tables
- CSS Layout - The display Property
- CSS Layout - CSS position
- CSS Layout - display: inline-block
- CSS Layout - Horizontal & Vertical Align
- CSS Combinators
- CSS Opacity / Transparency
- CSS Dropdowns
- Image Gallery
- CSS Attribute Selectors
- CSS Counters
- CSS Media Queries
CSS Opacity / Transparency
Transparent Image
The opacity property specifies the opacity/transparency of an element.
The opacity property can take a value from 0.0 - 1.0. The lower value, the more transparent:
Transparent Hover Effect
The opacity property is often used together with the :hover selector to change the opacity on mouse-over:
Example
img {
opacity: 0.5;
filter: alpha(opacity=50); /* For IE8 and earlier */
}
img:hover {
opacity: 1.0;
filter: alpha(opacity=100); /* For IE8 and earlier */
}
Download free E-book of CSS
#askProgrammers Learn Programming for Free
Join Programmers Community on Telegram
Talk with Experienced Programmers
Just drop a message, we will solve your queries
