css - div#myid 和 div #myid 之间的区别

Question

当我为一个页面编写 CSS 时，我发现当我以前执行 div#myid 时，我的 CSS 会应用于元素，而当我执行 div #myid 时它不适用，但我不认为这是错误的，我已经使用了很多次并且有效。 下面我的 CSS 是正确的，但第一个样式仍然不起作用，第二个样式起作用。

我已经在 fiddle 上放了一个样本，这里是链接 http://jsfiddle.net/bipin000/FnzNm/

table #tt
{
    background-color:#ccc;
}
table#tt
{
    color:yellow;
}


​<table id="tt">
    <tr><td>this is atable</td></tr>
</table>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

Answer 1

• div#myid 应用于 id 设置为 myid
的 div 元素
• #myid 适用于 ANY 元素，id 设置为 myid

---

i found that when i used to do div#myid then my css is applied to element and when i did div #myid it did not apply

它在 div#myid 和 #myid 上都能正常工作:

SEE DEMO

---

至于您的表格，这两个 table #tt 和 table#tt 之间存在差异。 空格 字符在这里起着重要的作用。

table #tt 表示 id 设置为 tt inside table 元素位于 任何 嵌套级别，而 table#tt 表示 table 且 id 设置为 #tt.

示例:

table #tt 可能表示以下任何一种:

<table>
  <td id="tt"></td>
</table>

<table>
  <td><div id="tt"></div></td>
</table>

<table>
  <td><span id="tt"></span></td>
</table>
<!-- etc -->

所以只有 id 设置为 tt inside table 的任何元素。

table#tt 仅表示:

<table id="tt">....</table>