id和类的区别是什么?

当涉及到CSS时，<div class="">和<div id="">之间有什么区别?是否可以使用<div id="">?

我看到不同的开发人员用这两种方式来做这件事，因为我是自学的，所以我从来没有真正弄清楚。

当前回答

id是唯一的。不类。元素也可以有多个类。类也可以动态地添加和删除到元素中。

任何可以使用ID的地方都可以使用类。反之则不然。

惯例似乎是对每个页面上的页面元素使用id(如“导航栏”或“菜单”)，对其他所有元素使用类，但这只是惯例，你会发现使用上的差异很大。

另一个区别是，对于表单输入元素，<label>元素通过ID引用字段，因此如果要使用<label>，则需要使用ID。是一个可访问性的东西，你真的应该使用它。

在过去的岁月里，id也是首选，因为它们很容易在Javascript中访问(getElementById)。随着jQuery和其他Javascript框架的出现，现在这几乎不是一个问题。

2009-02-12 23:34:18

其他回答

1) div id不可重用，只能应用于HTML的一个元素，而div类可以添加到多个元素中。

2)一个id更重要，如果两者都应用于同一个元素，并且有冲突的样式，id的样式将被应用。

3) Style元素总是引用div类。(点)在他们的名字前面，而div id类是通过在他们的名字前面放一个#(哈希)来引用的。

4)举例:-

2018-06-22 07:16:19

一个CLASS应该用于您希望具有相同样式的多个元素。ID应该用于唯一的元素。请参阅本教程。

如果您想成为一个严格的墨守成规者，或者如果您希望您的页面符合标准，那么您应该参考W3C标准。

2009-02-12 23:35:42

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

2020-08-07 22:25:58

类就像类别。许多HTML元素可以属于一个类，而一个HTML元素可以有多个类。类用于应用通用样式或可以跨多个HTML元素应用的样式。

id是标识符。他们是独一无二的;其他人不允许拥有相同的ID。id用于向HTML元素应用唯一的样式。

我以这种方式使用id和类:

<div id="header">
  <h1>I am a header!</h1>
  <p>I am subtext for a header!</p>
</div>
<div id="content">
  <div class="section">
    <p>I am a section!</p>
  </div>
  <div class="section special">
    <p>I am a section!</p>
  </div>
  <div class="section">
    <p>I am a section!</p>
  </div>
</div>

在这个例子中，标题和内容部分可以通过#header和#content设置样式。内容的每个部分都可以通过#content .section应用一个通用样式。只是为了好玩，我为中间部分添加了一个“特殊”类。假设您希望特定的部分具有特殊的样式。这可以通过.special类实现，但是section仍然继承了#content .section中的通用样式。

当我进行JavaScript或CSS开发时，我通常使用id访问/操作非常特定的HTML元素，并使用类访问/应用样式到广泛的元素。

2009-02-12 23:53:34

类用于具有公共属性的多个元素。例如，如果你想让p和body标签的颜色和字体相同，使用class属性或在一个除法本身。

另一方面，Id用于突出显示单个元素属性，并且仅用于特定元素。例如，我们有一个带有某些属性的h1标签，我们不希望它们在整个页面的任何其他元素中重复。

需要注意的是，如果在元素中同时使用class和id，则*id将覆盖class属性。*因为id只用于单个元素

参考下面的例子

<html>
<head>
<style>
    #html_id{
        color:aqua;
        background-color: black;

    }
    .html_class{
        color:burlywood;
        background-color: brown;
    }
</style>

   </head>
    <body>
<p  class="html_class">Lorem ipsum dolor sit amet consectetur adipisicing 
   elit. 
    Perspiciatis a dicta qui unde veritatis cupiditate ullam quibusdam! 
     Mollitia enim, 
    nulla totam deserunt ex nihil quod, eaque, sed facilis quos iste.</p>
    </body>
   </html>

我们生成输出

输出

2020-02-27 15:39:59

id和类的区别是什么?

推荐文章

最新文章

标签