CSS系列二 定义选择器

概述

选择器决定一个样式规则应用到哪个元素，目前CSS规范有五种定义选择器的方式。

• 元素名称。
• 上下文，比如示例中的选择器表示该规则将只被应用到在包含在h1元素下的em元素。

• 类或ID选择器
• 伪类选择器
• 属性选择器 

选择器可以是上述五种规则的组合，大多数情况只会使用一两种进行组合。另外如果你需要应用同样的规则到不同的元素组时，可以将同样的声明用于多个选择器。

 

名称选择器

名称选择器是最通用的选择器，被所有的浏览器支持。可以使用一个选择器，定义一组元素，这些元素之间用逗号分隔。当需要将一个样式规则应用到某个文档的指定名称的所有元素时使用此选择器，通常会将此元素和其他选择器组合使用。

类/ID选择器

如果使用id或class属性标记了元素，可以使用类/ID选择器，类/ID选择器被所有的浏览器支持。

使用#id语法来定义ID选择器，使用.class语法来定义类选择器。

下面的示例，选择所有的id属性值为gaudi的div元素，是名称选择器和ID选择器的组合。

上下文选择器

CSS可以根据元素的上下文来选择元素，这里的上下文是指被选择元素的祖先，父代，后代和兄弟。

• 祖先是包含被选择元素的任何元素，不管之间的层级。
• 父代是直接包含被选择元素的元素，这两个元素之间没有中间元素分隔。
• 后代是被选择元素直接包含的元素，这两个元素之间没有中间元素分隔。
• 兄弟是被选择元素的前后紧邻的元素。

后代选择器

后代选择器被所有的浏览器支持，语法规则是祖先元素名称和被选择元素之间逗号分隔，中间可以使用逗号分隔一个或多个中间元素。下面的示例将选择包含在id为gaudi的DIV元素的所有p元素。

父代选择器

除IE 7.0以前的版本不支持父代选择器，语法规则是祖先元素名称和被选择元素之间使用>分隔。下面的示例选择是id为gaudi的DIV元素的直接后代的所有p元素。

 

第一子元素选择器

除IE 7.0以前的版本不支持第一子元素选择器，语法规则是element:first-child，这里的element是指被选择元素，下面的示例选择是id为gaudi的DIV元素的第一个后代的p元素。

兄弟选择器

兄弟选择器目前被Firefox, Opera, 和IE 7支持。语法规则是兄弟元素和被选择元素之间使用+分隔，下面的示例选择是id为gaudi的DIV元素的后代，而且在紧跟在一个p元素后面的p元素。

First-letter/First-line元素选择器

可以只选择某个元素的一部分，比如第一行，第一个字母。这两个选择器被IE6.0以上，及其他所有浏览器支持。

First-letter和First-line选择器的语法规则是元素名称和first-letter/ first-line之间用:号分隔。下面的示例选择p元素的第一个字母。

链接选择器

可以基于链接(a)的状态来选择a元素。语法规则是a和状态名称之间用:号分隔。当一个链接要定义多个状态时，必须遵循如下顺序link, visited, focus, hover, active (LVFHA)，否则后面的规则会重写前面的规则。

 属性选择器

属性选择器被IE7.0及其他主流浏览器支持。可以根据属性名称或者属性值来选择元素。

语法规则是element[attribute]或element[attribute=value]，element表示元素名称,attribute表示属性名称,value表示属性值。

指定元素组

经常需要将同一个样式规则应用到多个元素，这可以将多个选择器使用逗号分隔来实现。

 

这些未免过于入门了吧？

不用着急，这才是序列二，后面还有呢，呵呵，我只是记录下我学习的过程。

一谈起CSS，好像很多人都熟悉，但是比如针对当前的规范支持，哪些操作在哪些浏览器是不支持的，或者如何做到一个XHTML文件可以支持多个浏览器，甚至手持设备，可能不是太清楚吧。

而这些知识，往往是你真正用CSS设计布局，而不是传统的TABLE设计布局的基础。

看看这个网页的源代码http://www.colly.com/morethandoodles/，或许会有些体会吧。

这些aptana足够了，根本不用学
FF也有很多插件帮助你做这个

怎么做不是最关键的，能做什么才是最关键的。

Dreamweaver等工具可以完成很多功能，但是不表示你不需要知道后面的一些知识。

我们是程序员，知其然还要知其所以然。

大家都知道CSS很简单，但是我看到国内的网站都是动辄几K行的代码，为什么？就是多了太多工具使用者了吧。

为了界面的优化，还是值得学习一下的；
个人感觉aptana不好，跑起来整的我的机子跟老牛似的，慢的受不了！

写css最棒的还是topstyle
楼主讨论css在这里恐怕很难有专业的氛围，这些东西放在经典论坛恐怕更好。（不过在那好像已经谈滥了）