CSS Basics Summary

I. Comparison of weights:

1. Element selected: ID selector > class selector > tag Selector

2. Element unchecked: Who is close to the target?

Two. Centering of elements

1. Center:

Center text	Center horizontally	Single row/MultiRow Property: Text-align:center
	Center vertically	Single line of text: Line-height=height (set line higher than high) Multiline text: Do not set the height, while setting the padding of the upper and lower equal
Center Box	Center horizontally	Properties: margin:0 Auto;
	Center vertically	does not set the parent box height, while setting the padding of the upper and lower equal

Container labels, text labels, block-level elements, inline elements

1. Container label: Simple to understand as a container that can nest all other labels

Example: DIV table ul ol li H DT DD etc.

2. Text-level Tags: only nested text/Pictures/Hyperlinks Tags

Example: Span p img a etc

3. Block-level elements: all container-level tags are block-level elements (P is also block-level elements)

Example: P,h1-h6,div,dl,ul,ol,li , etc.

4. Inline elements: All text-level tags are inline elements (except P)

Example: Span p img A input b u i etc

5. block-level element features:

L Exclusive Line

L can set the width height

If the width is not set, the child box is automatically filled with the content area of the parent box. (width is a box property cannot inherit)

Inline element Features:

L inline elements are displayed side-by

L The inline element cannot be set to a wide height

The size of the element in the row is open.

6. Conversion of block-level elements and inline elements

Display: Show mode

Block (inline element to block-level element, block-level has what characteristics, then this element has what characteristics )

Inline ( block-level elements into inline elements )

Inline-block (inline block, can be displayed side-by, and can be set to a wide height )

CSS Basics Summary