2

我正在浏览CSS :Class 和 ID。当我尝试他们给出的例子时，我不会觉得他们之间有任何区别。

<!DOCTYPE html>
<html>
<head>
<style>
#para1
{
text-align:center;
color:red;
} 
</style>
</head>

<body>
<h1 id ="para1">Hai</h1>
<p id="para1">Hello World!</p>
<p>This paragraph is not affected by the style.</p>
</body>
</html>

给我我希望的输出，其中说id 选择器用于为单个唯一元素指定样式。

我是否以错误的角度看待这个问题？

4

8 回答 8

7

一个唯一标识，另一个分类。

在第一种情况下，将两个事物称为同一事物是无稽之谈。

在第二种情况下，通常希望赋予一组事物相同的外观和感觉。

在 CSS 的上下文中，您应该只依赖类。CSS 的验证器应该避免使用 id 来应用样式。您仍然可以定义仅由一个不同元素使用的独特样式。

于 2013-03-12T08:44:30.913 回答
6

首先，w3schools 是一个可怕的资源。它写得不好，杂乱无章，没有重点，而且经常误导。您应该改用Mozilla 开发者网络中的这组更好的资源（它旨在实现相同的目标）。

您的示例根本不使用类。您有 CSS 调用一个 ID，以及 2 个具有该 ID 的 HTML 元素（您不应该这样做 - ID 应该是唯一的！）。两者的主要区别：

  1. ID 引用唯一元素。任何 1 个 ID 应该只有 1 个实例。类可以应用于很多元素，一个元素可以有多个classes
  2. 如果它们都尝试分配相同的属性，则使用 ID 的 CSS 规则将覆盖具有类的 CSS 规则。
  3. ID 用于各种原生应用程序：锚引用、表单、iframe，而类纯粹用于 CSS 样式。

我修改了您的代码作为这些要点的示例。以下是一些使用类的代码供参考：

.paragraph {
    font-style: italic;
    color: green;
}

和 HTML：

<p id="para1" class="paragraph">Blah blah blah</p>
于 2013-03-12T08:51:37.270 回答
1

您可以使用两者来设置元素的样式，但几乎没有区别：

  • 只能有一个具有给定 id 的元素，但许多具有给定类
  • id 选择器在 CSS 优先级计算期间被计为 100，当类选择器只有 10 时
于 2013-03-12T08:45:24.920 回答
1

这里有详细的解释。

当您希望在整个页面/站点中一致地设置多个元素的样式时，请使用类。当页面上有一个将采用该样式的元素时，请使用ID 。class是项目的一种类型，id是项目的唯一名称。

编辑：

CSS 不在乎

关于CSS，ID你不能用 a 做任何事情，Class反之亦然。我记得当我第一次学习CSS并且遇到问题时，有时我会尝试通过切换这些值来解决问题。没有。CSS不在乎。

Javascript 关心

JavaScriptclasses人们可能已经更熟悉和之间的差异了ID's。JavaScript 依赖于只有一个页面元素具有任何特定性，否则常用的getElementById功能将不可靠。对于熟悉 的人来说，您知道向页面元素jQuery添加和删除是多么容易。classes它是原生的和内置的jQuery. 请注意如何不存在这样的函数ID's。操纵这些值不是我们的责任JavaScript，它会导致比其价值更多的问题。

文档清楚地表明 HTML 要求ID属性在页面中是唯一的：

此属性为元素分配名称。此名称在文档中必须是唯一的。如果您有多个具有相同ID的元素，则您的HTML无效。

所以在JavaScript,getElementById()应该只返回一个元素。你不能让它返回多个元素。

好吧，您可以拥有多个具有相同 ID 的元素，但您不应该这样做 - 因为由于浏览器之间的差异，这样做的后果是不可预测的。

于 2015-02-05T07:42:23.827 回答
1

你拥有区分一个人和另一个人的 ID 的方式与它在 CSS 中的工作方式相同，就像你给一个项目一个特殊的标记，这样你就不会将它与另一个项目混淆，这就是 ID 在 CSS 中的工作方式，不止一个项目不能共享同一个 ID

于 2019-09-22T02:32:12.513 回答
0

在 CSS 中，类选择器是一个以句号 (“.”) 开头的名称，而 ID 选择器是一个以井号 (“#”) 开头的名称。ID 和类之间的区别在于，ID 可用于标识一个元素，而类可用于标识多个元素。

于 2019-09-22T00:29:14.043 回答
0

类选择器是一个以句号 (“.”) 开头的名称，而 ID 选择器是一个以哈希字符 (“#”) 开头的名称。ID 和类之间的区别在于，ID 可用于标识一个元素，而类可用于标识多个元素。

虽然 css 可能并不真正关心 ID 的唯一性，但 JavaScript 会，这就是为什么当你在 JavaScript 中处理 Document Object Model 时，如果你想选择一个 html ID，你使用 document.getElementByID()，注意“元素”，而对于类，您使用 document.getElementsByClassName() 这个有“元素”。

于 2019-09-22T01:14:53.703 回答
0

一个元素的 ID 是唯一的，一个元素只能有 1 个 ID。类可以应用于许多元素，一个元素可以同时有多个类

于 2019-09-22T02:40:56.560 回答