首页 文章

所有css样式规则都从一个div元素中剥离，但没有其他元素

提问于
浏览 次
0

我正在尝试为网站创建 Headers ，其中网站的 Headers 显示在图像上 . 我将其设置为使用带有背景图像的div类元素 . 但是，我无法弄清楚为什么我创建的div类元素中的背景图像没有显示 .

经过检查，我发现当我渲染它时，与div类元素相关联的css样式规则被剥离了元素（在Firefox和Chrome中，没有尝试IE） .

我有这样的CSS设置：

.text-over-image {
   width: 960px;
   height: 100px;
   background-image: url("http://www.lupenet.org/wp-content/themes/Lupenet/images/header.jpg");
   margin-left: auto ;
   margin-right: auto ;
}

h8 { 
   position: absolute; 
   top: 20px; 
   left: 400px; 
   width: 960px;
}

h8 span { 
   color: black; 
   font: bold 24px/45px Helvetica, Sans-Serif; 
   letter-spacing: -1px;  
   padding: 10px; 
}

h8 span.spacer1 {
   padding:0 5px;
}

而html看起来像这样：

<div class="text-over-image;" >
   <h8><span style="position:absolute;">La Unión Del Pueblo Entero<span class='spacer1'></span>
   <br><span class='spacer1'></span>"Celebrando el Pasado y Viendo Hacia el Futuro"</span></h8>
</div>

在意识到存在问题后，我设置了元素 .text-over-image 的高度和宽度属性，以防div被渲染得太小而无法查看图像，但背景图像仍未显示 . 当我使用firebug检查元素时，我发现div元素 .text-over-image 根本没有显示任何背景图像属性 . 事实上，所有css样式规则都从div元素中删除 .

我甚至尝试复制其他网站的css和html，这正是我正在尝试做的事情，但是当我这样做时，同样的事情发生了（样式规则从那个div元素中被剥离） . 但是，css样式规则不会从其他元素中删除 .

html css

2 回答

  • 0

    从 class 中删除 ; ：

    <div class="text-over-image;">

    它应该只是 <div class="text-over-image">

    jsFiddle example

    回复于
  • 2

    我读了你的CSS，之后我就到了这一点！ HTML中没有合法的 h8 元素 .

    所以我想问题是使用h8，尝试用h6替换它 .

    回复于

相关问题