Understanding CSS foreground color and transparency

Previous words

the appearance of color so that the page is no longer just black and white, the use of good color design, can make a lot of pages. the first impression that a Web page gives people is actually its overall color. for how to set the color, please go to the CSS 6 color mode. in fact, the application of color mainly divides into the foreground color, the background color and the transparent three parts. This article focuses on foreground color and transparency.

Color Foreground color

Value: <color> | Inherit

Initial value: User Agent-specific value

Applies to: all elements

Inheritance: There are

"Affect border"

In general, the foreground is the text of the element, but the foreground also includes the border around the element. There are two ways to directly affect the foreground color of an element, you can use the Color property, or you can use the property border-color to set the border color

"Inherit Color"

Color can be inherited, you can set all normal text in the document to a color, such as by declaring body{color:red;} Set to red. This turns all text that has no other style into red (such as anchors are not included and anchors have their own color styles). However, the browser has a predefined color for the form class element, so that the body color cannot be inherited into the form class element

Opacity Transparent (ie8-browser not supported)

Opacity is a property that is specifically used to set the transparency in CSS3, opacity can only set a transparency for the entire element, and its transparency inherits directly from its descendant elements

Values: Value | Inherit

Value: The default value is 1, which can fetch 0-1 of any floating-point number. Where 1 means completely opaque and 0 is completely transparent

Initial value: 1

Applies to: all elements

Inheritance: None

Compatibility

ie8-Browser does not support opacity transparent properties, you can use their own filters to achieve transparency of opacity transparency properties

Filter:alpha (opacity= transparent value), which is any integer between 0-100

Opacity:0.8;filter:alpha (opacity=80);

Understanding CSS foreground color and transparency