An example tutorial of Margin-top in Web page making

In HTML, margin-top is the distance between the object and the previous object, which is the CSS style that sets the distance outside the object's bounding rectangle. Let's take a good look at margin-top today.

Margin-top syntax

. div{margin-top:10px}

Set the object ". Div" to the top spacing of 10px

Related tutorials: margin

Second, Margin-top application example

In order to observe the effect, the instance sets 3 div boxes, all set the same width, same height, same CSS border, set margin-top:10px for the second Div layer, set margin-top:20px for the third Div layer, The observation effect grasps the Margin-top style function. The three object layers are named ". Div1" ". Div2" ". Div3", respectively, in Div class

Instance full HTML+CSS code

<! DOCTYPE html> 
Margin-top is the object distance setting set on the object distance, and if the object has no background set, the border can be replaced with padding-top.



Believe that you have seen these cases you have mastered the method, more wonderful please pay attention to the PHP Chinese network other related articles!

Related reading:

How to use the transform gradient property in CSS3

CSS3 the implementation of the effect of making the dynamic switch

The implementation steps of animation technology in CSS3