Day_8

　　CSS的外边距塌陷解决

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .top {
            width: 200px;
            height: 200px;
            background-color: skyblue;
            /*padding-top: 50px;*/
            /*外边距塌陷解决*/
            /*border-top: 1px solid skyblue;*/
            /*padding-top: 1px;*/
            /*overflow: hidden;*/
        }
        .low {
            width: 50px;
            height: 50px;
            background-color: red;
            margin-top: 50px;
        }
    </style>
</head>
<body>
    <div class="top">
        <div class="low"></div>
    </div>
</body>
</html>

　　border-top: 1px solid skyblue;

　　padding-top: 1px;

　　overflow: hidden；

　　这是三种外边距塌陷的解决方式，暂时学到这里，在考虑自己的写博客的方式，以后会花时间去好好提升一下自己的写作能力。

　　现在写的都是随笔，练练手先。

posted @ 2019-07-17 20:17  沐晴皓月  阅读(120)  评论(0)    收藏  举报