div 中未显示文字

Question

从头开始制作幻灯片，我试图在每张幻灯片的顶部添加文本，包含文本的 div 显示为空，但在页面上的其他任何地方都显示正常。

我要修复的元素是：

<div class="slide-title">test</div>

.slide-title{
  display: block !important;
  position: absolute;
  vertical-align: top;
  z-index: 999;
  top: 16px;
  left: 16px;
}

我在页面上放置了 3 次以测试它会出现在哪里。

Answer 1

来自您的代码笔，而不是此处发布的代码，您有 font-size: 2em;。因为你有

#slideshow {
    font-size: 0; /*Gets rid of horizontal space between images*/
}

设置，这是子元素的默认字体大小，因此 2em 与 0px 相同。适当更改其中一项措施（例如，将 2em 更改为 20px），您将看到更改。

div 中未显示文字

Text not showing up in div

html

css

inline

block

absolute