Day_8

  CSS solve the margins collapse

<!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;

  This are three ways to solve the margins collapse, temporarily learned here, in consideration of their way to blog, the future will take the time to properly raise my own writing skills.

  Now are written essays, practice your hand first.

Guess you like

Origin www.cnblogs.com/Whonenow/p/11203418.html