css - 如何在iframe中将透明图像放置在包含pdf的div上

我有一个Div包含一个iframe来显示pdf。我只想通过在iframe上建立一个透明的图像来保护我的pdf文件。所以没人能下载pdf。
我使用以下代码：

<div id="tobecovered">
    <p>your content...</p>
    <img src="./img/transparent.png" class="cover" />
</div>

div#tobecovered{
    position: relative;
}
div#tobecovered img.cover{
    position: absolute;
    /* position in top left of #tobecovered */
    top: 0; /* top of #tobecovered */
    left: 0; /* left of #tobecovered */
}

它在Chrome上运行良好，但在Mozilla Firefox上不工作。有人能帮忙吗？

最佳答案

给予图像100%的max-width; max-height：

div#tobecovered img.cover{
    position: absolute;
    /* position in top left of #tobecovered */
    top: 0; /* top of #tobecovered */
    left: 0; /* left of #tobecovered */
    max-width: 100%;
    max-height: 100%;
}

关于css - 如何在iframe中将透明图像放置在包含pdf的div上，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/14578173/