定位的配合使用

最新推荐文章于 2022-03-28 22:28:09 发布

Mr_White01

最新推荐文章于 2022-03-28 22:28:09 发布

阅读量475

点赞数

分类专栏： html5

本文链接：https://blog.csdn.net/Mr_White01/article/details/72859959

版权

html5 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

定位的配合使用

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            .div1{
                margin-left: 100px;
                border:  5px dashed cornflowerblue;
                display: inline-block;
                position: relative;             
            }
            img{
                width: 900px;
                }
                p{
                    font-size: 24px;
                    color: green;
                    /*float: left;*/
                    position: absolute;
                    top: 10px;
                    left: 10px;

                }

        </style>
    </head>
    <body>
        <div class="div1">
            <img src="../img/201412010941115182.jpg"/>
            <p>
                面对疾风吧
            </p>
        </div>
    </body>
</html>