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

This article mainly shows you the "use cases of margin attributes in CSS", which is easy to understand and clear, hoping to help you solve your doubts. Let me lead you to study and study the "use cases of margin attributes in CSS" this article.

The easiest way to set the margin is to use the margin property.

The margin property accepts any unit of length, which can be pixels, inches, millimeters, or em.

Margin can be set to auto. A more common practice is to set the length value for the outer margin. The following declaration sets a 4-inch wide white space of 1 inch on each side of the H2 element:

H2 {margin: 0.25in;}

The following example defines different outer margins for the four sides of the H2 element, using px units:

H2 {margin: 10px 0px 15px 5px;}

As with the inner margin setting, the order of these values is to rotate clockwise around the element starting with the top and outer margin (top):

Margin: top right bottom left

Alternatively, you can set a percentage value for margin:

P {margin: 10%;}

The percentage is calculated relative to the width of the parent element. In the above example, the outer margin set for the p element is 10% of the width of its parent element.

The default value for margin is 0, so if you don't declare a value for margin, there will be no margins. In practice, however, browsers already provide predetermined styles for many elements, and outmargins are no exception. For example, in browsers that support CSS, margins generate "blank lines" above and below each paragraph element. Therefore, if the outer margin is not declared for the p element, the browser may apply an outer margin on its own. Of course, as long as you make a special declaration, the default style will be overwritten.

The above is all the content of the article "use cases of margin attributes in CSS". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, 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.