css - 如何让CSS溢出可见渲染不透明元素

Question

CSS overflow: visible 属性允许在元素外呈现内容盒子。但是，Firefox 将溢出框的内容渲染为透明使下面的内容可见的背景。例如:

<div style="background:red;height:30px;">I want this to have<br>an opaque background.</div><div style="background:white">So that it does not show what is below.</div>

有没有办法让第一个 div 的所有内容都用背景不透明？

Answer 1

这是一种解决方案。

• 创建一个相对定位的 div，设置高度(即 30px)。
• 在其中放置一个绝对定位的元素，具有 100% 宽度/高度和不透明的背景图像(或使用 css)

Here's the code with an example.