HTML format layout

First, position : fixed

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

Second, position : Absolute

　　1. The outer layer has no position:Absolute (or relative), then the div is positioned relative to the browser, such as B (50 pixels from the right border of the browser, 20 pixels).

　　2. The outer layer has position:Absolute (or relative) , then the div is positioned relative to the outer border, such as Medium BB ( 50 pixels from the right border of D , and the bottom border from D is 20 pixels).

Third, position : relative

　　Relative position.

For example, fixed a position relative to the div contained in this Div . If the outer layer does not contain him, it is fixed relative to the browser relative to the position.

Iv. Stratification ( Z-index )

　　in the Z axis Direction Layering, can be understood to be divided into a stack of paper, the higher the number of layers on top.

In The example above, we saw that AA relative a , because the post code shows a higher level of display, so how do you make a cover AA without changing the code order ? As follows:

Five, float : Left , Right

Left , Right don't give him a position ( Left , Top ), directly relative to the browser. If the outer is wrapped, it is displayed relative to the top left or right of the position of the outer Div 's drop line.

　　Overflow:hidden; //Out part hidden, scroll, scroll bar displayed;

　　<div style= "Clear:both" ></div>//Cutoff

To set the style of a hyperlink example:

Attached: Cursor:pointer the mouse to the top of the shape

&copy Copyright Symbol ©

Translucent Effect:

<div class= "box" > Transparent area <div>

The code in the style sheet is:

. box

{

opacity:0.5; -moz-opacity:0.5; Filter:alpha (OPACITY=50)

}

HTML format layout