我正在使用http://validator.w3.org来验证我的代码。
但是我有45个错误,主要与重复的id有关。
我认为在可能的情况下重新使用CSS是一个很好的实践。
示例代码:
CSS
#cloudbullet {
background-color: #85c0bf;
height: 22px;
left: 13px;
margin-top: 7px;
position: relative;
top: 63px;
width: 20px;
HTML
<div id="container1-title" class="">
<h2>Cloud/Hosting</h2>
</div>
<div id="cloudbullet" class="">
</div>
<div id="cloudbullet" class="">
</div>
<div id="cloudbullet" class="">
</div>
<div id="cloudbullet" class="">
</div>
<div id="cloudbullet" class="">
</div>
<div id="cloudbullet" class="">
</div>
效果是我在垂直行中得到6个css框。
请有人建议我所做的事情是否正确,是否应该忽略验证或是否需要以不同的方式完成?
谢谢,
答案 0 :(得分:9)
对于多次出现的内容,您需要对其进行分类的内容,而不是识别它们。一个id在页面中应该是唯一的。
即使有些东西使用重复的标识符,但它并不确定它在所有浏览器中的工作方式是否相同,有些东西肯定不会起作用。例如,如果您想使用标识符来使用JavaScript查找元素,则会遇到问题。
请改用class属性。 CSS:
.cloudbullet {
background-color: #85c0bf;
height: 22px;
left: 13px;
margin-top: 7px;
position: relative;
top: 63px;
width: 20px;
}
HTML:
<div id="container1-title">
<h2>Cloud/Hosting</h2>
</div>
<div class="cloudbullet">
</div>
<div class="cloudbullet">
</div>
<div class="cloudbullet">
</div>
<div class="cloudbullet">
</div>
<div class="cloudbullet">
</div>
<div class="cloudbullet">
</div>
答案 1 :(得分:0)
明确的ID是唯一。文档中只有一个元素必须具有id。这就是为什么它被称为 id ,它是一个独特的标识符。
如果要将相同的规则应用于多个元素,那就是CSS类的用途。
答案 2 :(得分:0)
使用课程代替? HTML ID是唯一的,只能使用一次。 [1]