CSS选择器实例讲解
CSS选择器：标记选择器，类别选择器(.class)，ID选择器(#id) 的简单示例：
标记选择器：<style>h1{ color:blue; font-size:18px;}</style>
类别选择器:<html><head><title>class选择器</title><style type=”text/css”><!–.one{ color:blue; font-size:20px; }.two{ color:red; font-size:14px; }–></style></head><body> <p class=”one”>IT部落窝</p> <p class=”two”> IT部落窝</p></body></html> 很多时候页面中几乎所有的<p>标记都使用相同的样式风格，只有1-2个特殊的<p>标记需要使用不同的风格来突出，这时可以通过class选择器与标记选择器配合使用。<html><head><title>class选择器与标记选择器</title><style type=”text/css”><!–p{ color:blue; font-size:18px;}.special{ color:red; font-size:23px; }–></style></head><body> <p> IT部落窝</p> <p class=”special”> IT部落窝</p></body></html> 另外类别选择器还有一种很直观的使用方法，就是直接在标记声明后接类别名称，以此来区别该标记。<html><head><title>标记选择器.class</title><style type=”text/css”><!–h3{ color:blue; font-size:18px;}h3.special{ color:red; font-size:23px; }.special{ color:green;}–></style></head><body> <h3>标记选择器.class1</h3> <h3>标记选择器.class2</h3> <h3 class=”special”>标记选择器.class3</h3> <h3>标记选择器.class4</h3> <h3>标记选择器.class5</h3> <p class=”special”>使用于别的标记</p></body></html> 在HTML的标记中，还可以同时给一个标记运用多个class类别选择器，从而将两个类别的样式风格同时运用到一个标记中。这在实际制作网站时往往会很有用，可以适当减少代码的长度。<html><head><title>同时使用两个class</title><style type=”text/css”><!–.one{ color:blue; }.two{ font-size:22px;}–></style></head><body> <h4>一种都不使用</h4> <h4 class=”one”>同时使用两种class，只使用第一种</h4> <h4 class=”two”>同时使用两种class，只使用第二种</h4> <h4 class=”one two”>同时使用两种class，同时使用</h4></body></html>
ID选择器: ID选择器的使用方法跟class选择器基本相同，不同之处在于ID选择器只能在HTML页面中使用一次，因此其针对性更强。<html><head><title>ID选择器</title><style type=”text/css”><!–#one{ font-weight:bold; }#two{ font-size:30px; color:#009900; }–></style></head><body> <p id=”one”>ID选择器1</p> <p id=”two”>ID选择器2</p> <p id=”two”>ID选择器3</p> <p id=”one two”>ID选择器3</p></body></html> 从显示效果可以看到第2行与第3行都显示了CSS的方案，换句话说在很多浏览器一，ID选择器也可以用于多个标记。但这里需要指出的是，将ID选择器用于多个标记是错误的，因为每个标记定义的ID不只是CSS可以调用，JavaScript等其他脚本语言同样也可以调用。如果一个HTML中有两个相同ID的标记，那么将导致JavaScript在查找ID时出错。 正因为JavaScript等脚本语言也能调用HTML中设置的ID，因此ID选择器一直被广泛地使用。网站建设都在编写CSS代码时，应该养成良好的编写习惯，一个ID最多赋予一个HTML标记。 另外从最后一行可以看到没有任何CSS样式风格显示，这意味着ID选择器不支持像class选择器那样的多风格同时使用，类似”ID=”one two”是完全错误的语法。
