Chrome <span> 背景色答案

【问题标题】：Chrome <span> background-colorChrome <span> 背景色
【发布时间】：2011-11-15 01:25:43
【问题描述】：

我的 Chrome 有问题。我创建了一个网站，html 代码如下所示：

<div id="Content"> 
<h1><span id="back-color">Heading</span></h1> 
<p><span id="back-color">bla bla bla:</span></p> 
  <ul id="bild-liste"> 
    <li><span id="back-color"><a href="?section=Bilder&ID=1">AAAAAA</span></li> 
    <li><span id="back-color"><a href="?section=Bilder&ID=2">BBBBBB</span></li> 
    <li><span id="back-color"><a href="?section=Bilder&ID=3">CCCCCC</span></li> 
    <li><span id="back-color"><a href="?section=Bilder&ID=4">DDDDDD</span></li> 
    <li><span id="back-color"><a href="?section=Bilder&ID=5">EEEEEE</span></li> 
  </ul> 
</div>

我的 css-stylesheet 中有趣的部分如下所示：

#back-color
{
      background-color: white;
}

所以我只希望字母后面的颜色是白色的。这在 Opera 中效果很好，但是在 Chrome 中观看该站点时，背景仅在标题后面和“AAAAAA”后面是白色的，而不是在列表的其他元素后面。这很令人困惑，因为它只在 Chrome 中不起作用。也许有人有这个问题的解决方案。谢谢！

【问题讨论】：

标签： html css google-chrome

【解决方案1】：

一个 id 只能在一个网站上使用一次。改用 css 类

（将 id="back-color" 替换为 class="back-color" 并在您的 css-stylesheet 中使用 .back-color 而不是 #back-color

【讨论】：

嗨，MTilsted 是对的。 @user1045983 你可能会发现这篇感兴趣的文章css-tricks.com/818-the-difference-between-id-and-class 关于 id 和 classes 之间的区别。
感谢您的回答，但它也不适用于课程。同样的词白色背后仍然只有背景。
真的吗？你有一个网站的 html 是在线的吗？
问题是你没有结束你的标签。如果添加缺少的标记，它将按预期工作。
是的！非常感谢！这是一个愚蠢的错误！不过我学会了class和id的区别，谢谢！

【解决方案2】：

id用于引用一个唯一元素，所以多次使用会产生意想不到的结果。

另一方面，class 用于将元素组合在一起。例如：

<div class="indent">

您可以有多个共享class 的元素。引用类的 CSS 选择器是这样的：

.indent {
  foo: 'bar';
}

尝试使用class 而不是id，看看效果如何。

【讨论】：

谢谢，我是这样做的，但它也不起作用。你能帮帮我吗？
您能发布您的网站网址吗？