CSS中id和class的区别以及何时使用它

Question

CSS中id和class的区别以及何时使用它<style>     #main{         background: #000;         border: 1px solid #AAAAAA;         padding: 10px;         color: #fff;         width: 100px;     }</style><div id="main">     Welcome</div>在这里我给了一个id到div元素，并为此应用相关的CSS。或<style>     .main{         background: #000;         border: 1px solid #AAAAAA;         padding: 10px;         color: #fff;         width: 100px;     }</style><div class="main">     Welcome</div>现在我给了一个class到div它也在为我做同样的工作。那么，两者到底有什么区别呢？ID和班级，等级我应该什么时候使用id我应该什么时候使用class？我是CSS和网页设计方面的新手，在处理这个问题时有点困惑。

Answer 1

例

<div id="header_id" class="header_class">Text</div>#header_id {font-color:#fff}
.header_class {font-color:#000}

(请注意，CSS使用前缀#对于ID和.)

不过 color是HTML 4.01<font>标记属性在HTML 5中不受欢迎。在css中没有“字体颜色”，样式是color因此，上述案文应为：

例

<div id="header_id" class="header_class">Text</div>#header_id {color:#fff}
.header_class {color:#000}

文字应该是白色的。

Answer 2

ids是独一无二的

• 每个元素只能有一个

  id

• 每个页面只能有一个元素。

  id

classES并不是唯一的

• 你可以用同样的

  class

  多元素。
• 您可以使用多个

  class

  在同一元素上。

JavaScript关心

JavaScriptPeople可能已经更符合以下几个方面的差异：classES和idJavaScript依赖于只有一个具有任何特定内容的页面元素。id，或者其他常用的getElementById功能不能依赖。