Html 何时为css使用div#idname或#idname

要设置代码的样式，请执行以下操作：

   <div id="top-header">
        <div id="logo">
            <a href="http://example.com/>logo link</a>

        </div>
</div>

什么时候使用

div#logo{}

什么时候使用

#logo{}

？

div#logo

将仅适用于id为

logo

的元素，即div，而仅

#logo

将适用于id为

logo

的任何元素。但是，考虑到同一页上不应该有具有相同id的元素，这种特殊情况不应该有任何区别

当按类而不是id设置样式时，它更有用，例如：

<div class="top-header">
    <div class="logo">
        <a href="http://example.com/>logo link</a>

    </div>
    <span class="logo">Hello</span>
</div>

你好

---

此处

div.logo{}

不会将样式应用于跨度。

由于

id

是唯一的，

#logo{…}

就足够了

使用类时，您可以更加灵活，例如：

<div class="top-header">
    <div class="logo">
        <a href="http://example.com/>logo link</a>

    </div>
    <span class="logo">Hello</span>
</div>

CSS:

HTML:

标题
链接
跨度

在上面的示例中，标题和链接文本将为红色。但是，跨度将为蓝色。

ID始终是唯一的

在ID前面添加

元素

选择器是没有用的

以下是您应该避免对页面使用相同ID的原因。当您尝试动态添加样式时，您不能

编辑：我错误地判断了作者的评论

class=“logo”

为

id

很抱歉。

唯一有用的方法是选择一个元素，该元素具有id

logo

并且是

，或者如果不存在这样的

，则不选择任何元素。这个用例意味着您直到运行时才知道

#logo

是否是

或其他HTML元素（如

）的id

---

如果只想选择id为

#logo

的元素，那么只需使用

#logo

id在包含1000000个id的1000000个Div的网页中是唯一的含义，每个Div应该有一个特定的id，但是，它们可以具有相同的类

例子：把这个看成是一个有1000名学生的学校的教室。每个学生都有自己的学生ID，但他们都共享同一个班级

因此，如果学生是DIV，ID号为（#）567的学生将在css中按如下方式评分：

假设：

     <student id="1" class="Grade_03">...</student> // as in <div id="1" class="Grade_03"></div>

    <student id="2" class="Grade_01">...</student>
    <student id="3" class="Grade_02">...</student>
    <student id="n" class="Grade_03">...</student>

    Student#567{
    Math:90%;
    English:80%;
    }

//Or:

  #567{
    Math:90%;
    English:80%;
    }

如果您没有重复的学生ID，说出

Student#567

或

#567

都将指向同一个学生

可以这样想：“我只想选择一个id为div的元素。”。

---

在99%的情况下，使用

id

选择器就足够了，但是如果元素是动态添加的，并且您知道它将具有什么id，但不知道它将是什么类型的元素，那么您必须这样做。

id应该是唯一的，因此前缀“div”是多余的。不正确，它增加了特殊性，因此也有一个用途-一个页面上可以有h1徽标，另一个页面上可以有div徽标，但他们可以共享相同的CSS。这可能是必要的，当你编写更多HTML、CSS和Javascript时，总有一天你会遇到这种情况。是的，类是答案，但并非所有情况下都是如此…>>看到我的答案了吗above@ErickBest您是否知道ID应该是唯一的？？您的代码可以工作，但从技术上讲，使用相同的ID是100%错误的。如果页面遵循W3C标准，那么

Student#15

&

Teacher#15

应该是

Student.15

&

Teacher.15

虽然不能在同一页面上具有相同ID的元素，因为它将无法通过验证并可能导致神秘的错误，但也有可能存在（比方说）一页上有div#徽标，另一页上有h1#徽标。这似乎不是一个好的做法，但却是有效的。@yochannah当然。我在同一页上暗示-我将编辑我的答案以澄清这一点。+1对于我的愚蠢，误判

class

为

id

@没有问题。我想很容易错过。

     <student id="1" class="Grade_03">...</student> // as in <div id="1" class="Grade_03"></div>

    <student id="2" class="Grade_01">...</student>
    <student id="3" class="Grade_02">...</student>
    <student id="n" class="Grade_03">...</student>

    Student#567{
    Math:90%;
    English:80%;
    }

//Or:

  #567{
    Math:90%;
    English:80%;
    }

Student.Grade_03{
TeacherName:"Mr_Smith";
}