DIV 在 Chrome 和 Firefox 中不显示答案

【问题标题】：DIV Not Displaying In Chrome & FirefoxDIV 在 Chrome 和 Firefox 中不显示
【发布时间】：2015-11-19 19:38:12
【问题描述】：

我对使用跨浏览器 HTML/CSS 非常陌生。我正在尝试使用具有嵌入式 DIV 的 DIV 创建一个页面。

我想创建一个看起来像这样的页面：

我有一个带有背景图片的 DIV 以及包含背景颜色和文本的 DIV 中的“标题”DIV。像这样的：

<div>
    <div>
        <a/>
        <div>
            <h3/>
        </div>
    </div>
</div>

上面引用的网站似乎是这样做的。

但我无法让它在 Chrome 和 Firefox 中运行。它确实适用于 IE8（这是 IE 的版本 - 唯一的版本 - 我需要支持）。上面引用的网站确实可以在 Chrome 和 Firefox 中运行，所以我知道我做错了什么。

问题是在 Chrome 和 Firefox 上，标题部分不显示。我创建了一个小提琴：

这可能很简单，但我无法弄清楚我做错了什么。我很抱歉问了这样一个愚蠢的问题。

感谢您的帮助。

【问题讨论】：

您的内联样式使调试变得非常困难。
@ray 我同意。开始时这样做更容易，然后有点失控。
@TJGrant 这从来没有更容易或更好的方法。你为那个小提琴写了 3 次 css 代码。你在 jsfiddle 中有单独的“盒子”是有原因的。你为什么不把它弄对，然后我们可以帮助你？

【解决方案1】：

您已为锚标记定义（内联）opacity: 0;。

opacity 指定元素的透明度。该值适用于整个元素，包括其内容、元素及其包含的子元素。 0 是完全透明的，意味着不可见。

我更新了您的小提琴以供您查看http://jsfiddle.net/yongchuc/03ddL05k/4/。

【讨论】：