Li Hongqiang with you learn the front end (7) Positioning box CSS visibility sliding door case

Today is March 23, 2017

1 Review yesterday knowledge

1.1 Floating

Float:left | Right

Characteristics:

Floating element not occupying position (off-label)

To convert inline elements into inline block elements

Block-level elements are displayed on one line

A floating element is set, affecting the elements behind it

Role:

Solved text Picture wrapping problem

Making a Web navigation bar

Page layout

Clear floating

Clear the effects of floats

　　　

1.2 Positioning

Static positioning (statics)

Absolute positioning (absolute) look at face shape

Absolute positioning absolute de-labeling (not occupying position)

Inline elements into inline block elements

If the parent box does not have a location set, position it as a datum in the upper left corner of the browser

If the parent box is set to position, set the position to the upper left corner of the parent container

　　　　

Relative positioning (relative) narcissistic type

Look at your location. Set positioning

Relative positioning no off-label, occupied position

The father of the son

Li Hongqiang with you learn the front end (7) Positioning box CSS visibility sliding door case