CSS常用选择器总结.doc

CSS常用选择器1、 CSS元素选择器h1color:red;h2font-weight:bold;html:OKOK效果图：2、 选择器分租h1,h2color:bule;html:OKOK效果图：3、 类选择器(1).importantcolor:red;html:OKOK效果图：(2)h1.importantcolor:bule;Html:OK效果图：(3).importantfont-weight:bold;.warningfont-weight:italic;.important.warningbackground:silver;html:importantwarningimportant warning效果图：4、 ID选择器(1)#importantfont-weight:bold;Html:OK效果图：注意事项：1） 与类不同，在一个 HTML 文档中，ID 选择器会使用一次，而且仅一次。2） 同于类选择器，ID 选择器不能结合使用，因为 ID 属性不允许有以空格分隔的词列表。3） 这个规则会与以下各个元素匹配（这些元素不能在同一个文档中同时出现，因为它们都有相同的 ID 值）：OKOKOK4) 由于字母 i 的大小写不同，所以选择器不会匹配下面的元素。 OK5、 属性选择器：（1）可以对href属性的锚应用样式ahref color:red;html:百度效果图：（2）可以对多个属性进行选择ahreftitle color:bule;(只有具备属性href，并且同时有title的才可以用上面的选择器)html:百度效果图：也可以对带有alt属性的图片应用样式imgaltborder:5px splid red;(对有备注的图片进行设置图片属性)(3)选择有moons属性的所有planet元素，使之显示为红色planetmoonscolor:red;html:VenusEarthMars效果图：假设上面设定为planetmoons=“1”color:red;htmlVenusEarthMars效果图:(4)根据具体属性值进行选择(假设对指定文档的超链接变成红色)ahref=”/about_us.asp”color:red;html:关于百度效果图：注意：属性和属性值必须完全匹配，如果属性值有空格分隔的值列表例如：pclass=”important warning”color:red;那么html必须写成下列方式html:OK(5)根据部分属性值选择pclass=”important”color:red;(上面语句说明选择class属性中包含important的元素)html:OKOK效果图：6、 伪类和CSS类(1)锚伪类：a:linkcolor:#FF0000未访问的连接a:visitedcolor:#00FF00已访问的连接a:hovercolor:#FF00FF鼠标移到连接上a:activecolor:#0000FF选定连接注意:在CSS定义中，a:hover必须置于a:link和a:visited之后才有效a:active必须置于a:hover后才有效伪类对大小写不敏感(2