CSS样式-position（父r子a）的练习

<!DOCTYPE html>
<html lang="en">
<head>
 
    <title>Document</title>
    <style type="text/css">
        div {
            width: 674px;
            height: 674px;
            border: 1px solid #ccc;
            margin: 50px;
            padding: 10px;
            
            position: relative;
        }

 

        .top {
            position: absolute;
            top: 10px;
            left: 10px;
        }
    </style>
</head>
<body>
    <div>
        <img src="images/top_tu.gif" class="top" />
        <img src="images/风景.jpg" class="base" />
    </div>
</body>
</html>
 
==========运行效果（.top对应的图片浮动在.base的图片的上方）===========

 

 

posted @ 2021-03-14 15:42  #Friday  阅读(296)  评论(0)    收藏  举报