What are the CSS margin properties? What are the uses? Detailed

We are in the page layout, believe that the page design friends know that the margin property is a very important CSS style properties, then some novice may ask the margin attribute is what?

CSS style in the margin is the outer space outside the CSS, as the name implies, is to control the div block or each element between the left and right distance, obviously the role of margin in CSS is not to be underestimated. This article gives the novice little white introduce the specific usage of CSS margin properties. We hope to help you.

Here we explain in detail through specific code examples

A specific usage code example for the margin property in CSS is the CSS margin property :

<! DOCTYPE html>
The above code renders the effect in the browser such as:



We can see that the spacing between div blocks changes when the margin value is set for the element. div block Demo1 Since the Margin-left style attribute is set, the element moves 50 pixels from the left side of the browser, and after setting the Margin-top, the element is moved 50 pixels from the div block above, and then the Margin-bottom style attribute is added. , moving 50 pixels from the upper border of the div block below, the DIV block demo1 creates a bottom-left margin. We also added a margin-left style attribute to the second paragraph, and the text moved 50 pixels from the left border of the div in the demo1 to create the margin.

The value of margin can be selected up and down, of course, if we add margin:50px directly to Div, this property can also come out above the effect. Because when you add a value to margin by default, he is equal to the same value for four-sided distances. Or we add margin:50px 50px 50px 50px; that would be the equivalent of Margin-top, Margin-right, Margin-bottom, and Margin-left in CSS. By default, The left margin on the upper right is the clockwise direction.

So the above is about the CSS style in the margin property is the css in the margin properties of the specific use of the introduction, with a certain reference value, I hope to have the help of friends!