---恢复内容开始---
自己的一些简单记录,大概看下,然后对照着W3C都模拟一次。
最近我会把每个例子的属性的注释写完整和例子都会重新贴出来。
/**
*浏览器私有属性
* -webkit:chrome,safari
* -moz: firefox
* -ms:IE
* -o:opera
*
* @规则:
* @media:响应式布局
* @keyframes:css动画
* @font-face:引入外部字体
* ...
* 选择器:
* 一、简单选择器(可以组合)
* 标签选择器:
* 类选择器:
* id选择器:
* 属性选择器:[...] [type=button] [clss~=sports] [..|..] [att^=val]
* 伪类选择器:a:link{} a:visited{} a:hover{} a:active{} :enabled :disabled :checked
* li:first-chlid li:last-child li:nth-child(even)奇偶 li:nth-last-child()
* :only-child:只有一个子元素 dd:first-of-type last-of-type nth-of-type() nth-last-of-type
* :empty :root :not() :target() :lang()
*
*
*二、 伪元素选择器:(两个冒号:区别伪类)
* ::first-letter{}
* ::first-line{}
* ::before{}
* ::after{}
* ::selection{} 被用户选中的内容
*三、组合选择器:(后代选择器和子选择器)
* .main h2{}
* .main>h2{}
* h2+p{} 兄弟选择器
* h2~p{}
* 四、选择器分组
* h1,h2,h3{}
*
*
*
* 继承:
* body{font-family:"Microsoft Yahei"}
* color,font,text-align,list-style
* 非继承:background,border,position
*
* 优先级:
* A.行内样式 1000
* B.ID选择器 100
* C.类、伪类、属性选择器 10
* D.标签选择器和伪元素选择器 1
*
* css层叠:
* 1.优先级
* 2.如果优先级一样,后面覆盖见面
*
* css改变优先级
*
* 1.改变先后顺序(如果优先级一样)
* 2.
* 3.!important
*
*
*/
/**
*文本和颜色:
* 1.font-size:length(12px),percentage()
* 2.font-family:family-name(arial) , generic-family(serif,sanc-seif)#
* 3.font-weight:normal,bold,bolder,lighter,100,200
* 4.font-style:normal,italic(斜体),oblique(倾斜)
* 5.line-height:normal,number,length,percentage
* 6.color:red,#ff0000,rgb(255,0,0),rgba(255,0,0,1),rgba(255n0,0,0.5) 0.5的透明度
* color:transparent; 全透明
*
* 对齐方式:
* text-align:left,right,center,justify(两端对齐)
* vertical-align:baseline,sub,super,top,text-top,middle,bottom,text-bottom,百分比,length
* text-indent(缩进):length(px,em),百分比
* white-space:normal,nowrap,nowrap,pre,pre-wrap,pre-line
* word-wrap(长单词自动换行):normal,break-word
* word-break():normal,keep-all,break-all
* text-shadow(文字阴影):1px(x轴偏移方向) 2px(y轴偏移方向) 3px(模糊半径) #foo;
* text-decoration:none,underline,overline,line-through
* text-overflow(...):clip,ellipsis
* cursor(定义鼠标形状):(属性很多)
*/
---恢复内容结束---