可以对同一个html元素定义不同的样式,CSS的多种选择器的使用.ppt

什么是样式选择器是样式选择器当定义一条样式规则时必须指定受这条样式规则作用的网页元素在一条规则中定义的网页元素就是选择器也就是选择该样式规则作用于的网页元素选择器有标签就用选择器选择符就是赋予内部或外部样式表的名字的标签用来改变一个指定标签的样式任何一个元素都可以是一个选择符类选择器同一个选择器能有不同的类因而允许同一个元素有不同的样式定的方法类名类名是自定义的如果不加则代表所有元素类名类名类名同一个元素可以使用多个类类名之间使用空格分开选择器在页面中属性指定了某个单一元素属性就用来对单一元素定

什么是样式选择器 Selector { /* Selector 是样式选择器 */ property:value; /* color:red; */ property:value; /* font-size:4cm; */ … } Selector:当定义一条样式规则时，必须指定受这条样式规则作用的网页元素，在一条规则中定义的网页元素就是selector(选择器)，也就是选择该样式规则作用于的网页元素。 HTML选择器 HTML有标签， CSS就用选择器 选择符就是赋予内部或外部样式表的名字 HTML的标签，用来改变一个指定标签的样式 任何一个元素都可以是一个CSS选择符 类选择器 同一个选择器能有不同的类，因而允许同一个元素有不同的样式 定的方法 [tag].类名 (类名是自定义的,如果不加tag则代表所有HTML元素) (同一个元素可以使用多个类，类名之间使用空格分开) ID选择器 在HTML页面中， ID属性指定了某个单一元素，id属性就用来对单一元素定义单独样式 一个HTML页面中，ID属性值要唯一 #idname { } (idname是自定义的名称) 关联选择器 关联选择器只不过是一个用空格隔开的两个或更多的单一选择器给成的字符串 因为层叠顺序的规则，它们的优先权比单一的选择符大 必须按关联关系使用，不能有反顺序 只要能保持关联关系就可以，不管是在多少层 组合选择器 为了减少样式表的重复声明，组合是允许的 只要使用英文逗号(,)隔开每个选择符就可以了 伪元素选择器 伪元素选择器是指对同一个HTML元素在不同的状态下的一种定义方式 目前只有a和p两处HTML元素可以使用 使用时的语法 标签：伪元素 标签［.类名］：伪元素 a:link 没有任何运作前的状态 a:hover 光标移到到超链接上的状态 a:active: 选择超链接的状态 a:visited 访问过超连接的状态 p:first-letter 一个段落中首个字母的状态 P:first-line 一个段落中首行的状态 样式规则的继承 所有嵌套在某个HTML标签中的HTML标签都会继承外层标签设置的样式规则。 样式规则的优先级 关联>ID选择器>CLASS选择器>HTML标签选择器 总结 掌握各种样式选择器 Thanks CSS的多种选择器的使用 课程内容 什么是样式选择器 HTML选择器 类选择器 ID选择器 关联选择器 组合选择器 伪元素选择器 参考教材：《细说PHP》第四章 * *