css - 幻灯片标题高度不符合我的 CSS 属性

Question

为什么我的幻灯片标题不会根据我的 CSS 属性而改变？

这基本上就是我的幻灯片标题的工作方式

<div id="Slideshow">
<img src="image/s1.jpg" name="slide">
<script type="text/javascript">
<!--
var step = 1
function slideit() {
    document.images.slide.src = eval("image" + step + ".src")
    if (step < 5)
        step++
    else
        step = 1
    setTimeout("slideit()", 2500)
}
slideit()
//-->
</script>
</div>

如您所见，我将覆盖幻灯片的 CSS 声明为“幻灯片”

这是我的“幻灯片”CSS

#Slideshow
{
  position:absolute;
  top:121px;
  left:0%;
  width:100%;
  margin: 0px;
  height:150px;
}

尽管添加了宽度/高度属性，但幻灯片不会在视觉上发生变化。

Answer 1

我看到这些属性工作正常。我设置了这个：

小提琴

所以你可以看到它工作，它从顶部定位 121 像素，我将背景设置为黑色，所以你可以看到它的正确高度为 150 像素。

我还继续清理了 CSS 上的格式，给它留了空格并去掉了 Zeros 旁边的一些剩余字符

#Slideshow {
  background: #000;
  position: absolute;
  top: 121px;
  left: 0;
  width: 100%;
  margin: 0;
  height: 150px;
  overflow: hidden;
}

我还应该提到我添加了，overflow: hidden;因为我拥有的图像太大，所以overflow: hidden;防止元素（在本例中为图像）从它的父容器溢出。

让我知道这是否澄清了您的问题。