margin的具体用法

来源:互联网 发布:澳洲排油丸 知乎 编辑:程序博客网 时间:2024/06/18 14:35

转自:http://blog.sina.cn/dpool/blog/u/3498572990#type=-1

margin:?px; 意思就是上下左右元素块距离就是?px(?像素)等于margin-top:?px;

margin-bottom:?px;
margin-left:?px; margin-right:?px;其实都是设置不同的?像素属性。

例如:margin:5px 10px; 意思上下元素块距离为5px,左右的元素块距离为10px,等于margin-top:5px; margin-bottom:5px; margin-left:10px; margin-right:10px; 一样效果

又比如:margin:5px 6px 7px; 意思上元素块距离5px,下元素块距离为7PX,左右元素块距离为6px,等于margin-top:5px; margin-bottom:7px; margin-left:6px; margin-right:6px; 效果其实是一回道理;
再比如:margin:5px 6px 7px 8px; 意思上元素块为5px,右元素块距离为6px ,下元素块距离为7px,左元素块距离8px,等于等于margin-top:5px; margin-right:6px; margin-bottom:7px; margin-right:8px; 道理也是同理。
那么我们可能尝试了margin的边距布局那么padding呢?其实padding的写法大致也是相同或者说是一模一样也不为过,但是我们要注意的是,如果使用padding边距调整,我们可以用一种简易的写法来实现窗口自适应问题,但是下面描述的写法只支持IE8及其 以上。