如何隐藏/覆盖iframe的特定部分 [英] How to hide/cover a certain part of an iframe

问题描述

我有这个iframe:

I have this iframe:

<iframe width='828' 
        height='465' 
        frameborder='0' 
        allowfullscreen 
        src='https://www.firedrive.com/embed/B027D40BFCD0BBC0'>
</iframe>

，并想覆盖/删除角落的Firedrive徽标以使其无法点击.我怎样才能做到这一点.我已经在网上搜索了几个小时，但似乎对我没有任何帮助.

and would like to cover/remove the Firedrive logo in the corner to make it unclickable. How can I do this. I've been searching on the web for hours but nothing seems to work for me.

Jsfiddle: http://jsfiddle.net/aZ5p6/

Jsfiddle: http://jsfiddle.net/aZ5p6/

当心:该IFRAME包含ADS.徽标位于iframe的右上角.

Beware: THE IFRAME CONTAINS ADS. The logo is at the top right corner of the iframe.

我是html的新手，请不要简单地告诉我如何解决它，请把代码喂给我.

I'm a newbie at html, please do not simply tell me how to solve it, spoon feed me the code.

推荐答案

您必须在iframe周围添加一个容器/包装器.试试这个:

You must add a container/wrapper around the iframe. Try this:

CSS

.wrapper{
    position:relative;
    z-index: 1;
    display: inline-block;
}

.hidelogo{
    position: absolute;
    width: 150px;
    height: 40px;
    background: #222;
    right: 0px;
    bottom: 6px;
    z-index:999;
    display: block;
    color: #fff;
}

HTML

<div class="wrapper">
    <div class="hidelogo"></div>
    <iframe width='828' height='465' frameborder='0' allowfullscreen src='https://www.firedrive.com/embed/B027D40BFCD0BBC0'></iframe>
</div>

此处演示

DEMO HERE

这篇关于如何隐藏/覆盖iframe的特定部分的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！