Shulou(Shulou.com)06/01 Report--

This article mainly introduces the CSS margin grammar and function of what is the relevant knowledge, the content is detailed and easy to understand, simple and fast operation, has a certain reference value, I believe that you will have something to gain after reading this CSS margin grammar and function of what article, let's take a look at it.

I. CSS margin acquaintance

Margin sets the outer margin of the object, if we set a border style for DIV, we can see in the DW software that the margin setting value is actually the distance outside the border, which sets the style of the spacing between objects (DIV).

For more information, see the margin tutorial

II. Margin:0 auto function Grammar

1. Margin:0 auto introduction

Margin:0 auto sets the distance between the top and bottom of the object to 0, which is automatic.

Splittable: margin:0 auto 0 auto (up and down)

It can also be divided into: margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0

Screenshot of margin usage effect

2. Function

The margin:0 auto style of DIV is set to center the DIV horizontally in the browser. If the layout is in the middle and the level is in the middle, you can join margin:0 auto.

Third, the key node: auto (automatic, adaptive)

If a DIV we set the width to 500px, and then set the margin:0 auto style, if your browser window width is 1000px wide, this time the DIV left and right spacing for (auto) this time the browser will automatically distinguish DIV left and right 250px width spacing, then the DIV box will naturally be horizontally centered in the browser.

Why set up margin:0 auto?

Set this style to center the DIV layout horizontally in the browser, in order to be compatible with major browsers to center the layout. If you do not add the margin:0 auto CSS style, it will cause the layout to center in some browsers and some browsers to the left.

Ban: if you want to center the DIV layout in the browser, if you add margin:0 auto, you cannot add the float floating style to avoid logic errors, resulting in layout centring incompatibility.

This is the end of the article on "what is the margin Grammar and function of CSS". Thank you for reading! I believe you all have a certain understanding of the knowledge of "what is the grammar and function of CSS margin". If you want to learn more, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.