Opacity
Opacity sets the transparency of an element, including background, text and border.
It accepts values from 0.0 fully transparent to 1.0 fully opaque.
A similar effect that only applies to color and background-color can be achieved using the alpha transparency of rgba color eg background-color:rgba(0, 255, 0, 0.5);
Versions of IE 8 and earlier needed the proprietary filter property eg filter:alpha(opacity=40);
background-origin
Specifies where the background image is attached in the box.
- content-box is the area inside any padding or border.
- padding-box is from the outside edge of the padding.
- border-box is from the outside edge of the border and will sit on top of and cover the background.
When background-attachment is set to fixed this property has no effect.
See also:
background-size
Sets the size of background images. First value sets the width, second height. Negative values are not allowed.
Value of contain, scales the image preserving the aspect ratio, to the largest size that will fit within both width and height of the box.
Cover scales the image preserving the aspect ratio, to the smallest size that both width and height will cover the background area.
background-clip
Determines the background painting area of the box. Border-box the background will be painted to the borders, padding-box the background will be painted to the padding box.
Background (multiple)
Allows multiple background layers to be applied to a box.
The background values are supplied as a comma separated list with the first closest to the user the rest are ordered away from the user.
Other background properties can effect the position, size and tile of the images.
