搜影科技SEO试验田

最常用的选择器是类型选择器和后代选择器。类型选择器用来寻找特定的类型的元素，比如段落、锚或标题元素，只需指定希望应用样式的元素的名称。类型选择器有时候也称为元素选择器或简单选择器。
p{color:black;}
a{text-decoration:underline;}
h1{font-weight:bold;}
后代选择器可用来寻找特定元素或元素组的后代。后代选择器由其他两个选择器之间的空格表示。在下面的实例中，只在作为列表项的后代的锚元素上应用样式，而段落中的锚不受影响。
li a{text-decoration:none;}
这两种选择器适合于应用那些应用范围广的一般性样式。要想寻找更特定的元素，可以使用ID选择器和类选择器。顾名思义，这两种选择器用于寻找那些具有指定ID或类名的元素。ID选择器由一个#字符表示，类选择器由一个点号表示。下面示例中第一条规则使简介段落中的文本以粗体显示，第二条规则让日期显示为绿色。
#intro{font-weight:bold;}
.datePosted{color:green;}
<p id="intro">Some Text</p>
<p class="datePosted">24/3/2006</p>
正如前面提到的，许多CSS开发人员过度依赖类选择器和ID选择器（虽然后者的程度较轻）。
如果他们希望以一种方式对主内容区域中的标题应用样式，而在第二个内容区域中采用另一种方式，那么他们很可能创建两个类并且在每个标题上应用一个类。一种简单得多的方法是使用类型、后代、ID和（或）类集中选择器的组合：
#mainContent h1{font-size:1.8em;}
#secondaryContent h1{font-size:1.2em;}
<div id="mainContent">
<h1>Welcome to my site</h1>
...
</div>
<div id="secondaryContent">
<h1>Latest news</h1>
...
</div>
这是一个非常简单的实例。但是，只适用前面讨论的四种选择器就可以成功的找到许多元素。如果你发现自己在文档中添加了许多不必要的类，那么这可能是文档结构不合理的一个警告信号。这是应该分析这些元素之间的差异。你常常会发现唯一的差异是他们在页面上出现的位置。不要给这些元素指定不同的类，而是将一个类或ID应用于他们的祖先，然后使用后代选择器定位它们。