html在线编辑器

<!DOCTYPE html>
<html>
<head>
    <style>
        div.relative {
            position: relative;
            width: 400px;
            height: 200px;
            border: 3px solid #73AD21;
        }

        div.absolute {
            position: absolute;
            top: 80px;
            right: 0;
            width: 200px;
            height: 100px;
            border: 3px solid #73AD21;
        }
    </style>
</head>
<body>

    <h2>position: absolute;</h2>

    <p>
        位置为绝对(position:absolute)的元素;相对于最近定位的父元素定位(而不是相对于视口定位，如固定):
    </p>

    <div class="relative">
        这个div元素有position:relative;
        <div class="absolute">
            这个div元素有position:absolute;
        </div>
    </div>

</body>
</html>
评论区

()