资源描述：
《CSS知识点总结.doc》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。
1、一．Css分类1.替代replacedelements:imginput(radiobutton,checkbox,text)不可替代nonreplaceselements:html,xhtml,span,a,div,body,form,p,em,strong,2.block-levelandinline-level:(block可以包含inline元素，反过来是不可以的！)block-level:pdivliulinline-level:aspanstrongembiu二．选择器2.元素选择器：P{}3.GroupingSelec
2、tors(分组)eg:h2,p{color:gray;}4.Theuniversalselector（通配选择器）eg:*{color:red;}5.GroupingDeclarationseg:h1{font:18pxHelvetica;color:purple;background:aqua;}6.类选择器：.ddd7.ID选择器：#ddd8.属性选择器简单属性选择h1[class]{color:silver;}根据具体属性值p[class="warning"]{font-weight:bold;}根据部分属性值选择p[clas
3、s~="warning"]{font-weight:bold;}子串匹配属性选择器[foo^="bar"][foo$="bar"][foo*="bar"]特定属性选择类型*[lang
4、="en"]{color:white;}9.使用文档结构后代选择器blockquoteb,pb{color:gray;}选择子元素h1>strong{color:red;}选择相邻兄弟元素h1+p{margin-top:0;}10.伪类选择器静态伪类：a:visited{}a:link{}(好像用不了)动态伪类：a:focus{}(常用于input元素
5、)a:hover{}a:active{}选择第一个子元素：Li:first-child{}根据语言选择（）*:lang(fr){}结合伪类：link:hover:active{color:orange;}伪元素选择器：设置首字母样式li:first-letter{color:Red;设置第一行的样式：.aa:first-line{color:Purple;}设置之前和之后元素的样式：a:before{content:"{}";color:Silver;}a:after{content:"end";color:Aqua;}三．结构和层
6、叠1.特殊性：重要性：!Important(最强悍！)eg:p.dark{color:#333!important;background:white;}内联样式特殊性：1000ID选择器：0100li#answer{color:navy;}/*0,1,0,1(winner)*/类属性值，属性选择或伪类：0010h2.grape{color:purple;}/*0,0,1,1(winner)*元素和伪元素：0001h1{color:red;}/*0,0,0,1*/通配选择器：0000结合符:无继承：无（0特殊性比无特殊性的更强）Eg:
7、*{color:gray;}(（当h1中有其他元素时win）h1#page-title{color:black;}2.继承a)Border：没有继承b)Body:可以向上继承到html,其他的都是向下继承3.层叠：具有相同特殊性的靠后的权重大按权重和来源排序：（p79）读者的重要声明>创作人员的重要声明>创作人员的正常声明>读者正常>用户代理声明按特殊性排序按顺序排序Lvha顺序比较重要：即livevisitedhoveractive四．值和单位1.数字2.百分数3.颜色命名颜色：bluegreenwhiteredblackmaro
8、on...用GRB指定颜色函数式RGB颜色(百分数法：0%-100%，数字法：0-255)Eg:rgb(100%,100%,100%)rgb(0%,0%,0%)rgb(255,255,255)rgb(0,0,0)灰度表：p.one{color:rgb(0%,0%,0%);}p.two{color:rgb(20%,20%,20%);}p.three{color:rgb(40%,40%,40%);}p.four{color:rgb(60%,60%,60%);}p.five{color:rgb(80%,80%,80%);}p.six{co
9、lor:rgb(0,0,0);}p.seven{color:rgb(51,51,51);}p.eight{color:rgb(102,102,102);}p.nine{color:rgb(153,153,153);}p.ten{col
