Which edge does margin refer to in html5?

In HTML5, margin is used to refer to the "outer edge". This attribute can also be used to set all margin attributes of an element. This attribute can have 1 to 4 values, which are used to set four margins respectively. The value, the syntax is "margin: top margin, right margin, bottom margin, left margin;".

The operating environment of this tutorial: Windows 10 system, HTML5 version, Dell G3 computer.

Which edge does margin refer to in html5?

The margin shorthand attribute sets all margin attributes in one statement. This attribute can have 1 to 4 values.

Description

This shorthand property sets the width of all margins of an element, or sets the width of margins on each side.

The vertically adjacent margins of block-level elements will be merged, while inline elements will not actually occupy the top and bottom margins. The left and right margins of inline elements are not merged. Likewise, the margins of floated elements are not merged. It is allowed to specify negative margin values, but use caution when using them.

Note: Negative values ​​are allowed.

Example 1

margin:10px 5px 15px 20px;

The top margin is 10px

The right margin is 5px

The bottom margin is 15px

The left margin The margin is 20px

Example 2

margin:10px 5px 15px;

The top margin is 10px

The right and left margins are 5px

The bottom margin is 15px

Example 3

margin:10px 5px;

The top and bottom margins are 10px

The right and left margins are 5px

Example 4

margin:10px;

All 4 margins are 10px

Possible values ​​for this property:

• ##auto The browser calculates the margins.

• length specifies the margin value in specific units, such as pixels, centimeters, etc. The default value is 0px.

• % Specifies margins as a percentage of the containing element's width.

• inherit specifies that margins should be inherited from the parent element.

Recommended tutorial: "

html video tutorial"

The above is the detailed content of Which edge does margin refer to in html5?. For more information, please follow other related articles on the PHP Chinese website!