css笔记(一)
1、选择器
/*通配选择器,对所有元素都会应用*/*{color:gray}/*元素选择器,只应用到相应标签*/h1{color:gray}<h1>string</h1>/*类选择器,只相应到相应的class属性*/.waring{color:red}<h1 style="waring">string</h1>/*id选择器,只应用到相应的id*/#first{color:gray}<h1 id="first">string</h1>/*属性选择器,只应用到相应的属性*/h1 [type]{color:ray}/*属性值任意*/<h1 type="string">string</h1>h1 [type="abc"]{color:ray}/*属性值为abc*/<h1 type="abc">string</h1>h1 [type~="abc"]{color:ray}/*属性值一部分为abc*/<h1 type="123 abc def">string</h1>h1 [type^="abc"]{color:ray}/*属性值abc开头*/h1 [type$="abc"]{color:ray}/*属性值abc结尾*/h1 [type*="abc"]{color:ray}/*属性值包含abc*/h1 [lang|="en"]{color:ray}/*属性值为en或en-开头*//*后代选择器*/h1 em{color:gray}<h1>asd<em>fgh</em></h1>/*子元素选择器*/h1>em{color:gray}/*相邻兄弟元素*/h1+p{color:gray}/*伪类选择器*/a.visited {color:red}/*:link 未访问:visited 已访问:focus 输入焦点:hover 鼠标停留:active 鼠标点击:first-child 第一个子元素:first-letter 第一个字母(只应用于块级元素):first-line 第一行(只应用于块级元素):lang 语言选择(根据lang属性和meta元素结合来确定):before 之前:after 之后*/*:lang(fr){color:gray}h2:before {content:"))";color:gray} /*所有的h2元素之前增加银色的括号*/
font-family /*字体(Serif笔画有脚,Sans-serif笔画没脚,Monospace等宽,Cursive手写,Fantasy其它)*/front-weight /*加粗(lighter,normal,bolder,bold)*/font-size /*大小(px,em)*/font-style /*风格变形(italic斜体新字体,oblique原有字体上倾斜,normal)*/font-variant /*自体变形(small-caps小型大写字母,normal)*/line-hight /*行高*/text-indent /*缩进(px,em)*/text-aligh /*水平对齐(left,center,right,justify两端对齐)*/vertical-align /*垂直对齐(vertical,sub,super,top,text-top,middle,bottom,text-bottom)*/word-spacing /*字间隔*/letter-spacing /*字母间隔*/text-decoration /*文本装饰(underline,overline,line-through,blink)*/text-shadow /*阴影(前两个长度定义偏移距离,第三个长度模糊半径可选,颜色可在最前或最后*/white-space /*处理空白和换行符*/ 空白符 换行符 自动换行 pre-line 合并 保留 允许 normal 合并 忽略 允许 nowrap 合并 忽略 不允许 pre 保留 保留 不允许 pre-warp 保留 保留 允许font /*前三个属性(style,variant,weight)可有可无顺序不限,后面必须有两个或三个属性(size(,line-hight),family)顺序不能变,*/