设置1个div 浮在另一个上方

2018-08-20  本文已影响28人  谢小帅

原理:子 div 以 relative 的方式浮动在父 div 上方。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>DIV 浮动</title>

    <style>
        .below {
            position: absolute;
            width: 200px;
            height: 200px;
            border: 1px solid #000;
            background: #999;
        }

        .above {
            position: relative;
            width: 100px;
            height: 100px;
            border: 1px solid #F00;
            background: #FFF;
            z-index: 1;
        }
    </style>

</head>
<body>

<div>
    <div class="below">
        我浮动在下面,你只能看到这些
    </div>
    <div class="above">
        我浮动在上面
    </div>

</body>
</html>
效果图
上一篇 下一篇

猜你喜欢

热点阅读