Html basics (5) --- css style sheet -- style attributes -- format and layout,-css style sheet

Html basics (5) --- css style sheet -- style attributes -- format and layout,-css style sheet

I,Position:Fixed

Lock location (relative to the browser location), such as the pop-up window in the lower right corner of some websites.

Example:

II,Position:Absolute

Absolute position:

1. The outer layer does not have position: absolute (or relative); then the div is located relative to the browser, for example, center B (50 pixels away from the right border of the browser and 20 pixels away from the bottom border ).

2. The outer layer has position: absolute (or relative); then the div is located relative to the outer border, such as bb (50 pixels from the Right Border of d and 20 pixels from the bottom border of d ).

Example:

III,Position:Relative

Relative Position:

For example, it is fixed relative to a certain position of the div containing this div. If the outer layer does not contain other elements, it is fixed relative to the browser.

Example:

4. Layered (Z-index)

InZLayered in the direction of the axis. It can be understood that the layers are higher and closer to the top.

In the above relative example, we can see that aa hides a, because the higher the display level of the Code to be written later, so how to make a cover aa without changing the code order. As follows:

Example:

V,Float:Left,Right

Left,RightYou do not need to specify the location (Left,Top), Directly relative to the browser. If the external side is wrappedDivTo the upper left or upper right of the row.

Additional: 1,Overflow: hidden; // hide the excess part; scroll: displays the scroll bar;

<Div> 1 <! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN "" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> 2

Webpage running display: