css - 背景小于包含 div(可变大小)

标签 css

我想在嵌入式媒体后面创建一个略微缩进的背景,其大小各不相同。它应该看起来像这样:

what it should look like

看到 youtube 视频的顶部和底部的绿色背景是如何略微缩进的吗?我已经按照我的意愿显示了其他所有内容,我只是不知道如何将背景稍微定位在嵌入式媒体元素的内部。特别是因为我知道媒体元素的大小会发生变化。

你可以在 JSfiddle 上看到我到目前为止的内容.

最佳答案

简单的给负margin like

iframe { margin-top: -10px; }

DEMO

关于css - 背景小于包含 div(可变大小),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9476179/

相关文章:

html - 具有 2 个渐变级别(色标)的线性渐变三 Angular 形

html - 为什么我的右侧 div 不与其他部分一起 float ?

html - 使用带有 :hover 的多层菜单时奇怪的灰色底线

javascript - 跨浏览器平滑滚动?

html - CSS 如何保持页面居中,但仍然把东西放在我想要的地方

javascript - 匹配 css 类并使用 jquery 和 regex 删除

javascript - 查找具有特定第一级后代的第一个父元素

html - 如何让整个输入文本框充满整个div

html - 响应式图像在加载时没有布局重排

css - 通过 CSS 在 JQuery Mobile 中居中文本