本文核心部分来自MDN，有兴趣的小伙伴常去看看兴许会有些收获
margin-top: 10px; /* 绝对长度 /
margin-top: 1em; /相对于字体大小 /
margin-top: 5%; /相对于最相邻的父级元素块（block）的宽度*/
这个属性对于不可替换的inline元素没有效果,比如<tt>或者<span>
MDN的介绍已经说得好清楚了，主要的用法第一个常用，需要添加一个就是
margin-top：1rem
rem和em的区别就是，rem表示相对于根元素设置的字体大小，而em表示相对于父元素字体大小而设置。
margin-top：百分比，我是不常用的，但是padding-top：百分比，就可以用下了。padding-top的用法和margin-top的用法相似。
在遇到需要是父元素的高度不确定，宽度也不确定，但是想设置子元素的高度与父元素的宽度成一定比例时，padding-top就可以用到了，不过，需要注意的是，该子元素只能在其中设置背景图片类的填充，如果写入文字的话，会影响布局。
