新しいCSS3セレクター：
属性セレクタ：
1、E[attr]：只使用属性名，但没有确定任何属性值
2、E[attr=“value”]：指定属性名，并指定了该属性的属性值
3、E[attr~=“value”]：指定属性名，并且具有属性值，此属性值是一个词列表，并且以空格隔开，其中词列表中包含了一个value词，而且等号前面的“〜”必须的
4、E[attr^=“value”]：指定了属性名，并且有属性值，属性值是以value开头的
5、E[attr$=“value”]：指定了属性名，并且有属性值，而且属性值是以value结束的
6、E[attr*=“value”]：指定了属性名，并且有属性值，而且属值中包含了value、E[attr|=“value”]：指定了属性名，并且属性值仅是value或者以“value-”开头的值（比如说left-con）
アプリケーション：接尾認識アイコンによると、
疑似クラスセレクタ：
構造擬似クラス：
:first-child{} 第一个子元素
:last-child{} 最后一个子元素
:nth-child(n){} 指定位置的子元素
2n 偶数 even
2n-1 奇数 odd
:first-of-type{} 指定类型的第一个子元素
:last-of-type{} 指定类型的最后一个子元素
:nth-of-type(n){} 指定类型,且指定位置的子元素
:root 直接选中根元素 html
:empty 选中空元素
アプリケーション：インターレース色テーブル
：n番目の子（奇数）{ }
特定の擬似クラス：
e:target{} 匹配所有的e元素,且匹配关联的元素
アプリケーション：タブの設定は、
リンクをクリックしてはDIV1のIDを示しDIV1
のid DIV2を表示するには、リンクをクリックしてDIV2
のid DIV3とクリックDIV3リンク表示要素を
アプリケーション：アコーディオン効果
UI状態擬似クラス：
:enabled{} 选中可用状态
:disabled{} 选中不可用状态
:checked{} 选中默认选中状态
::selection{} 选中用户选中的状态改变高亮(颜色)
アプリケーション：フォームの選択状態
1に選択された無線高さ幅が増加
ダイナミック疑似クラス：
:link{} 选择被定义了超链接并未被访问过的元素，常用于链接描点上
:visited{} 选择被定义了超链接并已被访问过的元素，常用于链接描点上
:hover{} 选择被激活的元素，常用于链接描点和按钮上
:active{} 选择用户鼠标停留的元素，IE6及以下浏览器仅支持a:hover
:focus{} 用户行为选择器,元素获取焦点
アプリケーション：
：フォーカス{}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{margin: 0;padding: 0;}
input:focus{
background: pink;
}
</style>
</head>
<body>
<input type="text" />
<input type="text" />
<input type="text" />
</body>
</html>
二時間を選択します。
レベルセレクター：
e > f: e元素下的所有子集f,不包括孙集
e + f: e元素后的第一个兄弟f (只选中了一个)
e ~ f: e元素后所有的兄弟f (选中不止一个)
例えば：
.box a 选中后代,不论是儿子还是孙子,都选中box 下的 所有 a 都会被选中
.box>a 选中儿子,孙子不会被选中
p + a 只选中紧跟在p后的第一个a (只能选中一个)
p ~ a 选中p标签后的所有 a (可以选中多个)
