Day.01.22 青铜级盒子案例

<!DOCTYPE html>
<html>
 <head>
 <meta  charset="utf-8">
  <title> 青铜级盒子案例 </title>
    <style type="text/css">
        body{
            width:500px;
            height:500px;
            border:1px solid red;/*边框*/
        }
        #div-box1{
            width:100px;
            height:100px;
            border:1px solid blue;
            margin:10px 0 0 10px;/*距离边框的距离*/
        }
        #div-box1 img{
            width:80px;
            border:1px solid black;
            margin:10px 0 0 10px;
        }
    </style>
 </head>
 <body>
    <div id="div-box1">
        ![](图片路径)
    </div>
 </body>
</html>

总结
1:border和margin 是上右下左的顺时针顺序;

《Day.01.22 青铜级盒子案例》 QQ截图20170122191815.png

    原文作者:挂树上的骷髅怪
    原文地址: https://www.jianshu.com/p/daa046460988
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞