#id和div＃id之间的区别

我是新来的css。有人可以帮我区分“#test”和“div＃test”吗？#id和div＃id之间的区别

<html> 
 
    <head></head> 
 
    <body> 
 
    <div> 
 
    <span>Some stuff here..</span> 
 
    </div> 
 
    <div id="test"> 
 
    <span>This is my data</span> 
 
    </div> 
 
    </body> 
 
</html>

来源

2017-06-16 Abhishek Panda

ID与＃，其中id是一个唯一的标识符来表示。你可以使用id做一个css选择器。 –

我会建议你阅读选择器和它们的特殊性。 – evolutionxbox

你真的不应该有资格按照MDN标记名的ID，如下所示：

不符合规则的ID标记名称或类别

如果规则的ID 选择器作为其关键选择器，请不要将标记名称添加到规则。由于ID是唯一的，添加标签名称会减慢匹配过程中不必要

来源

2017-06-16 08:06:30 slevy1

这值得赞赏 – karthick

#test将采取元素与ID 测试而div#test只会采取DIV名为测试的ID。这并没有太大的区别，因为ID必须是唯一的。

这种信息是很容易找到，你可能想看看W3schools documentation

来源

2017-06-16 08:00:11 ViLar

的主要区别是特异性的重量变化。

做#ID比DIV＃ID不太具体

这意味着你的DIV＃ID规则被使用，因为它具有较高的特异性值

div#id {background: #000} 
#id {background: #fff}

的div与该ID的背景将是黑色的，即使后来选择了另一个规则

来源

2017-06-16 08:00:49 ThisGuyHasTwoThumbs

#id是选择id =“firstname”的元素。它是一种CSS选择器。

检查CSS选择在https://www.w3schools.com/cssref/css_selectors.asp

有微小的差别。

当您使用div＃id它将只适用于附加到div的#id。否则，该规则将被忽略。

希望它有帮助。谢谢

来源

2017-06-16 08:03:34

#id & div＃id仅在将样式应用到该元素时才有所不同。

浏览器通过计算特异性来计算最相关的元素。

特异性计算规则是在以下链接 https://www.w3.org/TR/CSS22/cascade.html#specificity

#ID将是0100 和DIV＃ID将是0103

那么什么是数字意味着，如果你写

div#id { 
    background: green; 
} 

#id { 
    background: red; 
}

箱子的颜色会变成绿色

参考号： https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

来源

2017-06-16 08:04:12 karthick

当您使用div＃id时，它将只应用于附加到div的#id。 div＃id的特异性超过#div。

来源

2017-06-16 08:04:25

<html> 
<style> 
    div#test { 
    background: green; 
} 
inspector-stylesheet:1 
#test { 
    background: red; 
} 
</style> 
<body><div> 
    <span>Some stuff here..</span> 
    </div> 
    <div id="test"> 
    <span>This is my data</span> 
    </div></body> 
<span id="test">This is my data</span> 
</html>

基本上ID是唯一的，但是，以显示与组合DIV＃ID使用时，如果有与测试两种不同的元素，然后两个不同元素的元素是如何具体较强会是什么样DIV＃ID指定元素

来源

2017-06-16 08:05:52

正如你可以看到下面，div#test是仅适用于使用ID test div的选择。 #test将选择编号为test的每个元素。

但是，既然你不应该多次使用一个id，这应该不成问题。 div#test只会减慢DOM中的匹配，所以你不应该使用它。

要明确：如果你链接元素和ID，你更具体。这意味着，这些规格将始终覆盖较不具体的规格。

div#test{color:green} 
#test{color:red}

颜色会变成绿色。

如果您的意思是div #test，那是通过DOM树链接。

div#test{ float:right} 
 
#test{color:green} 
 
div #test{margin-left:60px}

<html> 
 
    <head></head> 
 
    <body> 
 
    <div> 
 
    <span>Some stuff here..</span> 
 
    </div> 
 
    <div id="test"> 
 
    <span>This is my data</span> 
 
    </div> 
 
    <span id="test">no data</span> 
 
    <div> 
 
    <span id="test">heres data</span> 
 
    </div> 
 
    <div> 
 
    <p> 
 
     <span id="test">heres data aswell</span> 
 
    </p> 
 
    </div> 
 
    </body> 
 
</html>

来源

2017-06-16 08:07:37 Greaka

的特异性是不同的（div#test一个较高）和div#test仅适用于一个div，而不是其他的标签。

div#test特异性是0101

#test特异性是0100

Specificity Calculator

来源

2017-06-16 08:11:09 itacode

#id和div＃id之间的区别

回答

相关问题