html在线编辑器 | 21xrx.com

<!DOCTYPE html>
<html>
<head>
    <style>
        .container {
            position: relative;
        }

        .topright {
            position: absolute;
            top: 8px;
            right: 16px;
            font-size: 18px;
        }

        img {
            width: 100%;
            height: auto;
            opacity: 0.3;
        }
    </style>
</head>
<body>

    <h2>图片和文字</h2>
    <p>文字显示到图片的右上角:</p>

    <div class="container">
        <img src="/public/images/example_one.jpg" alt="Cinque Terre" width="1000" height="300">
        <div class="topright">右上角</div>
    </div>

</body>
</html>

评论区

{{item['qq_nickname']}}

()

回复

回复

21技术 www.21xrx.com 备案号：蜀ICP备17043188号-2