css常用选择器总结

css常用选择器总结

ID:11208390

大小:59.31 KB

页数:8页

时间:2018-07-10

css常用选择器总结_第1页
css常用选择器总结_第2页
css常用选择器总结_第3页
css常用选择器总结_第4页
css常用选择器总结_第5页
资源描述:

《css常用选择器总结》由会员上传分享,免费在线阅读,更多相关内容在行业资料-天天文库

1、CSS常用选择器1、CSS元素选择器h1{color:red;}h2{font-weight:bold;}html:

OK

OK

效果图:2、选择器分租h1,h2{color:bule;}html:

OK

OK

效果图:1、类选择器(1).important{color:red;}html:OKOK

效果图:(2)h1.important{color:bule;}Html:OK

2、效果图:(3).important{font-weight:bold;}.warning{font-weight:italic;}.important.warning{background:silver;}html:important

warning

importantwarning

效果图:1、ID选择器(1)#important{font-weight:bold;}Html:OK

效果图:注意事

3、项:1)与类不同,在一个HTML文档中,ID选择器会使用一次,而且仅一次。1)同于类选择器,ID选择器不能结合使用,因为ID属性不允许有以空格分隔的词列表。2)这个规则会与以下各个元素匹配(这些元素不能在同一个文档中同时出现,因为它们都有相同的ID值):OKOKOK4)由于字母i的大小写不同,所以选择器不会匹配下面的元素。OK

1、属性选择器:(1)可以对href属性的锚应用样式a[href]{color:r

4、ed;}html:百度效果图:(2)可以对多个属性进行选择a[href][title]{color:bule;}(只有具备属性href,并且同时有title的才可以用上面的选择器)html:百度效果图:也可以对带有alt属性的图片应用样式img[alt]{border:5pxsplidred;}(对有备注的图片进行设置图片属性)(3)选择有moons属性的所有planet元素,使之显示为红色planet[moons]{color:

5、red;}html:VenusEarthMars效果图:假设上面设定为planet[moons=“1”]{color:red;}htmlVenusEarthMars效果图:(4)根据具体属性值进行选择(假设对指定文档的超链接变成红色)a[href=”http://www.baidu.com/about_us.asp”

6、]{color:red;}html:关于百度效果图:注意:属性和属性值必须完全匹配,如果属性值有空格分隔的值列表例如:p[class=”importantwarning”]{color:red;}那么html必须写成下列方式html:OK

(5)根据部分属性值选择p[class=~”important”]{color:red;}(上面语句说明选择class属性中包含important的元素)html:

7、nt”>OK

OK

效果图:1、伪类和CSS类(1)锚伪类:a:link{color:#FF0000}未访问的连接a:visited{color:#00FF00}已访问的连接a:hover{color:#FF00FF}鼠标移到连接上a:active{color:#0000FF}选定连接注意:在CSS定义中,a:hover必须置于a:link和a:visited之后才有效a:active必须置

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。