Question

我的网站上的编码有问题。基本上我已经在页面上插入了以下html代码（第743节）：

> <div>
>     <div>
>         <iframe width="315" height="200" src="//www.youtube.com/embed/ucXRLnIkTyQ" frameborder="0"
> allowfullscreen></iframe>

然后使用以下CSS将视频设置为静态图像：

div {
    position: relative;
    padding-top: 25px;
    padding-bottom: 67.5%;
    height: 0;
}
div iframe {
    body.home
    box-sizing: border-box;
    background: url(http://www.ildottoredellepiante.it/formazione/wp-content/uploads/2017/05/laptop-png-6754.png) center center no-repeat;
    background-size: contain;
    padding: 1% 17.5% 19.8%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

我如何在CSS中告诉我们仅在＆＃34;部分-743＆＃34;中显示图像和视频。的网站？而不是像现在这样在博客文章和其他小部件中随处可见，它不应该显示。

我试图添加：

.section-743

和

#section-743

在CSS的开头但不幸的是它没有用。知道我该如何解决这个问题？基本上笔记本电脑的图像应仅显示在我的网站的视差部分而不是其他任何地方。

我期待着您的回复。

提前感谢您的帮助！非常感谢！

Answer 1

看一下这篇文章：https://www.w3schools.com/css/css_syntax.asp

您正在寻找的是ID和类选择器。但是，这些并不神奇，需要您将它们分配给页面上的元素。

我在您的示例中为DIV代码添加了ID（我添加了结束DIV代码）：

<div id="outerDiv">
    <div id="innerDiv">
        <iframe width="315" height="200" src="//www.youtube.com/embed/ucXRLnIkTyQ" frameborder="0" allowfullscreen></iframe>
    </div>
</div>

现在，您可以像这样引用CSS中的DIV标记：

#outerDiv {
    /* outer div style */
}
#innerDiv {
    /* outer div style */
}
#innerDiv iframe {
    /* iframe inside innerDiv style */
}

注意最后一个，它允许您引用IFRAME内的innerDiv。

请注意，您的ID 必须对整个页面都是唯一的。

如何将图像仅设置为css中的某个视差部分

1 个答案: