Html element classification-grimace
Directory
- Block-level elements
- Inline Element
- Inline block-level elements
- Summary
I. block-level elements)
Definition: By default,Exclusive rowIs a block-level element.
Features:
- Each block-level element starts from a new row, and the subsequent element also starts from another row. (A block-level element excludes one row)
- You can set the height, width, row height, and top and bottom margins of an element.
- If the element width is not set, it is 100% of its parent container (consistent with the width of the parent element ).
Common block-level elements:
,
,...,
,
,
,
,
2. inline)
Definition: Inline element, also called intra-Row Element. By defaultSame rowAnd the height and width of the element.Cannot be setIs an inline element.
Features:
- And other elements are on one line;
- The height, width, and top and bottom margins of the element.Not AllowedSettings;
- The width of an element is the width of the text or image it contains and cannot be changed.
Common inline Elements:,,
,,,,,,,,
3. inline block elements (inline-block)
Definition: By defaultSame rowAnd the height and width of the element.ConfigurableIs an inline element.
Features:
And other elements are on one line;
You can set the height, width, row height, and top and bottom margins of an element.
Common inline block-level elements:,
Iv. Summary
Regardless of the elements, they can all be converted to each other through the display attribute in css.