IE6-7下margin-bottom不兼容解决方法(非原创,视频中看到的)

在IE低版本下有很多不兼容,现在将看到的   IE6-7下margin-bottom不兼容解决方法   演示一下,方便日后自己查阅。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="keywords" content="">
    <meta name="description" content="">
    <title></title>
    <style>
        .test1{
            zoom:1;/*兼容IE6*/
            margin-bottom: 10px;/*IE6-7无法正常显示可以采用padding-bottom*/
        }
        .test1::after{
            content: '';display: block;clear: both;
        }
        .t1{
            float: left;
        }
    </style>
</head>
<body>
    <div class="test1">
        <div class="t1">1111</div>
    </div>
    <div class="test2">222</div>
</body>
</html>

从上面可以看到,在IE6-7下面.test1里面有浮动(有做清楚浮动),那么.test1会出现margin-bottom值失效的问题,.test1可以直接使用padding-bottom来解决兼容。

本人是小白,第一写,不喜勿喷。

原文地址:https://www.cnblogs.com/webBlog-gqs/p/6511219.html