如何让图片叠加在下划线上请参考图片

Question

我有这个图像，我想使用CSS和html在下面实现我想要一个图像覆盖下划线，该图像是使用MS word生成的

请帮帮我，先谢谢你了

我已经尝试过这个由于限制无法发布整个base64

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Signature Overlay</title>
    <style>
        /* styles.css */
body {
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background-color: #f0f0f0;
}

.signature-container {
    position: relative;
    display: inline-block;
}

.signature-container img {
    max-width: 100%;
    height: auto;
    display: block;
}

.underline {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #000; /* Change this to your preferred underline color */
}

    </style>
</head>
<body>
    <div class="signature-container">
        <img src="data:image/jpeg;base64,/9j/4>
        <div class="underline"></div>
    </div>
</body>
</html>

Answer 1

尝试像这样改变底部：

.underline {
    position: absolute;
    bottom: 25px;
    left: 0;
    right: 0;
    height: 2px;
    background-color: #000;
}

如何让图片叠加在下划线上请参考图片

问题描述投票：0回答：1

1个回答

最新问题

如何让图片叠加在下划线上请参考图片

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1