Question

这是初学者的问题，但我需要澄清一下。是的，根据大多数教程，它不能多次应用。

ID是唯一的每个元素只能有一个ID 每个页面只能有一个具有该ID的元素
参考 http://css-tricks.com/the-difference-between-id-and-class/

但我在HTML中编写了一个简单的标记并应用了一些CSS。

这是我的代码

HTML

<!DOCTYPE html>
<html>
<head>
    <title>ID vs Classes</title>
    <link rel="stylesheet" type="text/css" href="ID & Classes.css">
</head>
<body>
    <h1 id="forh1">This is a h1 header</h1>
    <p>Lorem ipsum dolor sit amet</p>

    <h1 id="forh1">This is a h1 header</h1>

    <p>Curabitur sodales ligula</p>

    <h2 id="forh1">This is a h2 header</h2> 
</body>
</html>

CSS

#forh1{
text-align:center;


}

我已多次应用相同的ID（3次）。在h1标题中两次，在h2标题中一次。当我在浏览器（chrome＆amp; firefox）中运行它时，它们运行得很好。 h1和h2标题中的所有文本都对齐居中。这是为什么？我没有正确掌握ID概念还是浏览器的问题？因为我听说现代浏览器足够聪明，可以理解大多数隐含的东西。请帮忙。

Answer 1

您可以多次使用ID。浏览器仍将应用样式。但是，这不是最佳做法，并被归类为无效标记。

要绕过它，您可以向元素添加一个类。可以根据需要在任意数量的元素上使用类。

检查W3C validator，它会抛出错误duplicate ids

Answer 2

ID用于唯一地识别元素，它们将在CSS运行时起作用，但是当JavaScript付诸行动时，您将理解为什么不这样做。

CSS只选择元素，当你编写匹配的选择器时，它与你编写的有效或无效的HTML无关，CSS的工作是按照定义的选择器应用样式。例如

Demo 无效HTML，请勿使用 （仅用于演示目的）

因此，ID＆＃39; s应该是唯一的，如果您想在多个元素上使用相同的属性，请使用class。

来自W3C

此属性为元素指定名称。此名称必须是唯一的在文件中。

侧提示：使用_代替空格 ~~href="ID & Classes.css"~~ 应为href="IDs_Classes.css"。

Here's a good read, on why not to do that （所以不会在这里重复）

Answer 3

要回答您的问题：是的，您可以多次应用ID，因为您的测试已经过验证。

无论其！

即使这在现代浏览器的测试中按预期工作，但您无法保证它在旧版浏览器中工作，或者以这种方式在IE中工作。你也没有保证像getElementByID这样的javascript函数可以按预期工作。正如其他人已经回答的那样：html中的多个ID被认为是不好的做法，并且误用了类＆amp;的概念。 IDS。

Answer 4

对于Html和Css： -
在CSS代码页中，
考虑一下，您已经为ID创建了一个样式。
在Html页面中，
您可以根据自己的意愿多次应用该ID的样式。

但是，对于Javascript和JQuery： -
如果对多个字段使用相同的ID，则无法验证该字段。
因为，ID必须是唯一的才能对Javascript和JQuery执行操作。

我希望你明白。

Answer 5

我建议首先将css应用于您的代码，因为这样可以更轻松地更新您的网页

h1 {

 text-align:center;

}

我可以在CSS中多次应用ID吗？

5 个答案: