基础 - CSS3

CSS3

　　CSS2的下一个版本

　　目前最流行

 

CSS3的兼容情况

　　各大浏览器对CSS3的兼容还不够完善

　　通常给属性前加不同的前缀，来实现兼容不同的浏览器

　　-webkit-

　　移动端的兼容更好些

渐进增强原则

　　对于高版本，支持的更好

　　对于低版本，支持相对不好，但是也可以使用

 

CSS3手册

　　http://css.doyoe.com/

　　[]　　可选的

　　||　　或

　　|　　 多个选择一个

　　？　　可写可不写

　　*　　 0个或多个

　　{}　　范围

 

CSS3选择器

属性选择器

　　

		div[sample] {
			/*有sample属性*/
		}
		div[sample|="some"] {
			/*有sample属性,而且属性值是"some-"类型或"some"*/
		}
		div[sample~="some"] {
			/*有sample属性,而且属性值中有"some"属性值*/
		}
		div[sample^="some"] {
			/*有sample属性,而且属性值以"some"作为前缀*/
		}
		div[sample$="some"] {
			/*有sample属性,而且属性值以"some"作为后缀*/
		}
		div[sample*="some"] {
			/*有sample属性,而且属性值中含有"some"字符串*/
		}
		div[sample="some"] {
			/*有sample属性,而且属性值为"some"*/
		}

　　

伪类选择器

 

　　　　　　　　　element:first-child {
			/*伪类，element元素的父级的所有任意元素的第一个,要求选中元素必须为element类*/
		}
		element:last-child {
			/*伪类，element元素的父级的所有任意元素的最后一个,要求选中元素必须为element类*/
		}
		element:only-child {
			/*伪类，element元素的父级仅有的element元素*/
		}
		element:first-of-type {
			/*伪类，element元素的父级的所有element元素的第一个*/
		}
		element:last-of-type {
			/*伪类，element元素的父级的所有element元素的最后一个*/
		}