The application of CSS position attribute in div layer

Positioning, the parent div set position:relative, the child Div Position:absolute will be relative to the parent div for absolute positioning, next for you to introduce the CSS position attributes in the div layer application

Originally only understand position:relative is relative positioning, position:absolute is absolute positioning;

You often see a text description of a semi-transparent background underneath a picture carousel. I now have to do such an effect, because it is not a carousel, so did not go to find plug-ins, want to write their own.

Semitransparent backgrounds can set properties Background:rgba (0, 0, 0, 0.15);

Positioning, the parent div set position:relative, the child Div Position:absolute will be relative to the parent div for absolute positioning. That would be convenient.

Copy Code code as follows:
. Banner{margin:20px;height:204px;position:relative;overflow:hidden}
. Banner. Content{color: #FFF; Font-size:24px;line-height:30px;font-weight:800;background:rgba (0, 0, 0, 0.15); position:absolute;left:0;right:0;bottom:0;}

Effect: