网站用户体验整合设计-体验css+div 之为样式找到目标

体验css+div 之为样式找到目标

Post by 张美工, 2008-7-8, Views:

有效且结构良好的文档为应用样式提供了一个框架。要想使用CSS将样式应用于特定的（X）HTML元素，需要有办法找到这个元素。在CSS中，执行这一任务的样式规则部分称为选择器（selector,也称为选择符）。

1。常用的选择器

最常用的选择器类型是类型选择器和后代选择器（descendant selector）。类型选择器用来寻找特定类型的元素，比如段落、锚或标题元素，只需指定希望应用样式的元素的名称。类型选择器有时候也称为元素选择器或简单选择器。

p{color:black;}

a {text-decoration:underline;}

h1{font-weight:blod;}

后代选择器可用来寻找特定元素或元素组的后代。后代选择器由其他两个选择器之间的空格表示。在下面的示例中，只在作为列表项的后代的锚元素上应用样式，而段落中的锚不受影响。

li a {text-decoration:none;}

2.通用选择器

通用选择器可能是所有选择器中最强大却最少使用的。通用选择器的作用就像是通配符，它匹配所有可用元素。与其他语言中的通配符一样，通用选择器由一个星号表示。通用选择器一般用来对页面上的所有元素应用样式。例如，可以使用以下规则删除每个元素上默认的浏览器填充和空白边：

*{padding:0;

margin:0;

}

在与其他选择器结合使用时，通用选择器可以用来对特定元素的所有后代应用样式，或者跳过一级后代。

3。高级选择器

CSS2有许多其他有用的选择器。不幸的是，虽然Firefox和Safari等现代浏览器支持这些高级选择器，但是IE6和更低版本不支持。好在在创建CSS时考虑到了向后兼容性。浏览器不理解某个选择器，那么它会忽略整个规则。因此，可以在现代浏览器中应用样式和易用性方面的改进，同时不必担心它在老式浏览器中造成问题。但是要记住，在对于站点功能很重要的任何元素上应该避免使用这些高级选择器。

3.1：子选择器和相邻同胞选择器

3.2：属性选择器

相关文章：　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　
# Dreamweaver的超级技巧汇总(6)
# Dreamweaver的超级技巧汇总(5)
# Dreamweaver的超级技巧汇总(4)
# Dreamweaver的超级技巧汇总(３)
# Dreamweaver的超级技巧汇总(2)
# Dreamweaver的超级技巧汇总(1)
# 在线QQ MSN TEL交谈工具代码
# 方便使用的一些小简短input\form代码
# VSS使用手册
# JS表单判断函数代码大全 (三)
# JS表单判断函数代码大全 (二)
# JS表单判断函数代码大全

# I E和火狐的css兼容性问题归总