Formatting and layout

Formatting and layout

Flow-Through layout:

Float:left/right to Zoo/right flow

Clera:both Cutoff

For example, the wood on the water to hit the wall, stop each, first flow to the wall to stop first

Element juxtaposition

Element nesting

Positioning layouts:

Position:fixed/absolute/relative;top Right Bottom Left

The difference between three kinds of positioning methods

①position:fixed-Lock position (relative to the current browser boundary), such as the pop-up window in the lower right corner of some sites

②position:relative-relative position (coordinates at the position where the element should be)

③position:absolute--relative position

No position (absolute relative) style in peripheral elements--left with browser border

If there is a position (absolute relative) style in the periphery-the coordinate layout of the element closest to its perimeter

< only when the position is set, the top right bottom left (up and down) can be used >

④z-index-Layering (the larger the value, the higher it is) layered in the direction of the z-axis, which can be understood to be divided into a stack of paper, the higher the number of layers upward

Report:

Overflow:hidden; -Hide when out of range, scroll, scroll bar when out of range

A:hover--Sets the form when the mouse points to the link (A is a tag)

{CURSOR:POINTRT (mouse refers to the shape above, pointer is small hand shape)}

opacity:0.5; -moz-opacity:0.5; Filter:alpha (OPACITY=50)--a transparency effect of 50%, three ways to choose one

Display:none; Hide or block display (hidden will remove this element directly)

Visibility:hidden; Hide/Show visible (element position is still, content is hidden)

border-radius:15px; -Rounded border with a rounded corner size of 15 pixels

&copy--Copyright symbol

Formatting and layout