CSS id 选择器

id 取舍器

id 取舍器 可 认为标有特定 id 的 HTML 元素指定特定的 款式 。

id 取舍器以 "#" 来定义 。

下面的两个 id 取舍器，第一个 可以定义元素的 色彩为红色，第二个定义元素的 色彩为绿色：

#red {color:red;}
#green {color:green;}

下面的 HTML 代码中，id 属性为 red 的 p 元素显示为红色，而 id 属性为 green 的 p 元素显示为绿色 。

<p id="red">这个段落是红色 。</p>
<p id="green">这个段落是绿色 。</p>

留神：id 属性不得不在每个 HTML 文档中浮现一次 。想晓得缘由吗，请参阅 XHTML:网站重构 。

id 取舍器和派生 取舍器

在现代布局中，id 取舍器 一般用于 构建派生 取舍器 。

#sidebar p {
 font-style: italic;
 text-align: right;
 margin-top: 0.5em;
 }

上面的 款式只会 利用于浮现在 id 是 sidebar 的元素内的段落 。这个元素很可能是 div 或者是表格单元， 只管它也可能是一个表格或者 其余块级元素 。它甚至 可以是一个内联元素， 比方 <em></em> 或者 <span></span>，不过这样的用法是非法的，由于不 可以在内联元素 <span> 中嵌入 <p> (假如你 淡忘了缘由，请参阅 XHTML:网站重构) 。

一个 取舍器，多种用法

即便被标注为 sidebar 的元素不得不在文档中浮现一次，这个 id 取舍器作为派生 取舍器也 可以被 使用很 频繁：

#sidebar p {
 font-style: italic;
 text-align: right;
 margin-top: 0.5em;
 }

#sidebar h2 {
 font-size: 1em;
 font-weight: normal;
 font-style: italic;
 margin: 0;
 line-height: 1.5;
 text-align: right;
 }

在这里，与页面中的 其余 p 元素显而易见不同的是，sidebar 内的 p 元素得到了特殊的 解决，同时，与页面中 其余全部 h2 元素显而易见不同的是，sidebar 中的 h2 元素也得到了不同的特殊 解决 。

径自的 取舍器

id 取舍器 即便不被用来 缔造派生 取舍器，它也 可以独立 施展作用：

#sidebar {
 border: 1px dotted #000;
 padding: 10px;
 }

依据这条 规定，id 为 sidebar 的元素将 占有一个像素宽的黑色点状边框，同时其 四周会有 10 个像素宽的内边距(padding，内部空白) 。老版本的 Windows/IE 阅读器可能会 忽略这条 规定，除非你特殊地定义这个 取舍器所属的元素：

div#sidebar {
 border: 1px dotted #000;
 padding: 10px;
 }