Css3的基礎(chǔ)
常用屬性選擇器：
1、標(biāo)簽名稱[屬性]、選中帶有其屬性的標(biāo)簽！
2、標(biāo)簽名稱[屬性="屬性值"]、選中屬性，并規(guī)定帶有其屬性值！
需了解的選擇器：
- 標(biāo)簽名稱[屬性~="value"]、選中屬性，并規(guī)定包含在內(nèi)的任意屬性值都可以！
- 標(biāo)簽名稱[屬性^="value"]、選中屬性，并規(guī)定以屬性值第一個(gè)字符為開(kāi)頭的即可！
- 標(biāo)簽名稱[屬性$="value"]、選中屬性，并規(guī)定以屬性值最后一個(gè)字符為結(jié)尾的即可！
- 標(biāo)簽名稱[屬性*="value"]、選中屬性，并規(guī)定帶有其屬性值的任意字符都可以！
- 標(biāo)簽名稱[屬性|="value"]、選中屬性，并規(guī)定帶有其所有屬性值即可（如以value-xx等）！
結(jié)構(gòu)性偽類選擇器：
X:first-child 其父元素的首個(gè)子元素
X:last-child 匹配父元素中最后一個(gè)X元素
X:nth-child(n)用于匹配索引值為n的子元素。索引值從1開(kāi)始 X:nth-last-child(n)從最后一個(gè)開(kāi)始算索引。
X:first-of-type匹配同級(jí)兄弟元素中的第一個(gè)X元素；
X:last-of-type匹配同級(jí)兄弟元素中的最后一個(gè)X元素
X:nth-of-type(n)匹配同類型中的第n個(gè)同級(jí)兄弟元素X
X:nth-last-of-type(n) 匹配同類型中的倒數(shù)第n個(gè)同級(jí)兄弟元素 X:only-of-type匹配屬于同類型中唯一兄弟元素的X
總結(jié)常用的選擇器：X:nth-child(n){選擇器都一樣的時(shí)候使用}、X:nth-of-type(n){選擇器不一樣的時(shí)候使用，先篩選}
目標(biāo)偽類選擇器 :target 選擇匹配E的所有元素，且匹配元素被相關(guān)url指向
UI 元素狀態(tài)偽類選擇器
- E:enabled 匹配所有用戶界面（form表單）中處于可用狀態(tài)的E元素
?- E:disabled匹配所有用戶界面（form表單）中處于不可用狀態(tài)的E元素
- E:checked 匹配所有用戶界面（form表單）中處于選中狀態(tài)的元素
-E ::selection 匹配E元素中被用戶選中或處于高亮狀態(tài)的部分
動(dòng)態(tài)偽類選擇器 ::link \:hover \:visited \:active\ E:focus 用戶行為選擇器 選擇匹配的E元素，而且匹配元素獲取焦點(diǎn) 語(yǔ)言偽類選擇器:E:lang(en) 否定偽類 選擇器 E:not(選擇器) 匹配所有不匹配簡(jiǎn)單選擇符s的元素E
層級(jí)選擇器：
：選擇直接自己元素、+：選擇同級(jí)元素（相鄰）、~：選擇所有同級(jí)元素（除本身）
瀏覽器前綴：
語(yǔ)法-x-。ms IE瀏覽器、moz 火狐、o opera瀏覽器（已淘汰）、webkit 谷歌、Safari 文本屬性：
文字陰影：text-shadow、
盒子陰影：box-shadow
-屬性值 px水平位置+px垂直位置+px模糊程度+顏色
@font-face的語(yǔ)法規(guī)則：字體圖標(biāo)
@font-face {
?font-family: 'icomoon';
?src:url('fonts/icomoon.eot');
?src:url('fonts/icomoon.eot?#iefix') format('embedded-opentype'),
?url('fonts/icomoon.svg#icomoon') format('svg'),
?url('fonts/icomoon.woff') format('woff'),
?url('fonts/icomoon.ttf') format('truetype');
?font-weight: normal;
?font-style: normal;
}
CSS3新增背景屬性：
background-origin 背景原點(diǎn)，屬性值：padding-box 背景圖像填充的相對(duì)位置
border-box 背景圖像邊界框的相對(duì)位置
content-box 背景圖像的相對(duì)位置的內(nèi)容框。默認(rèn)值為padding-box
background-cil 背景裁切，屬性值：border-box 背景被裁切到邊框盒
padding-box 背景被裁切到內(nèi)邊距框
content-box 背景被裁切到內(nèi)容框。默認(rèn)值為border-box。
background-size 背景尺寸，屬性值：
1設(shè)置百分比調(diào)整圖像大小
2 cover讓圖片等比例放大，不會(huì)變形，使背景圖像完整覆蓋背景區(qū)域。
3 contain把圖像擴(kuò)大到最大尺寸（寬大先寬，高大先高）
顏色特性了解：rgba、hsl、hsla。 (面試可能會(huì)問(wèn))
邊框?qū)傩裕篵order-color-----邊框顏色。
border-radius 圓角邊框，可設(shè)置值為px像素。常用有一個(gè)值和四個(gè)值。Eg：小米logo
