万能清除法 

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>h5</title>
<style type="text/css">


    body,html{
        
        width:100%;
        height:100%;
    //    background-color:blueviolet;
        
        
        
    }
    .box{
        
        background-color: aqua;
        width:100%;
        min-height:100px;
        max-height:600px;
        height: auto !important;
        height: 500px;
        
    }
     .name{
        
        
        background-color: red;
        height: 20%;
    }
    .name:after{
        
        
        content:"后面的伪对象";
    }
    .name:before{
        
        content:"前面的伪对象";
    }
    .name:first-letter{
        color:blue;
    }
    .name:first-line{
        
        color:#031E27;
        font-size:35px;
        
        
    }
    .clear{
        
        
        
        border:3px solid #876262;
        
    }
    .clear .class2{
        
        
        width:500px;height: 500px;float:left;background-color: blue
        
    }
    .clear .class{
        
        
        width:500px;height: 500px;float:right;background-color:#2F6C26
        
    }
    .cle:after{
        content:".";
        display: block;
        width:100%;
        height:0;
        overflow: hidden;
        clear: both;
        visibility: hidden;
    }
    </style>
</head>

<body>
    
     
     <div class="clear cle">
         <div class="class"></div>
         <div class="class2"></div>
         
     </div>
</body>
</html>

 

posted on 2017-11-09 13:40  奔跑的葛根  阅读(302)  评论(0)    收藏  举报

导航