選擇器
- 通用選擇器：
* {}
- id選擇器
#header {}
- class選擇器
.header {}
- 元素選擇器
div {}
- 子選擇器
ul > li {}
- 后代選擇器
div p {}
- 偽類選擇器
:hover {}
::selection {}
.action {}
:first-child {}
:last-child {}
:first-of-type {}
:last-of-type {}
:nth-of-type(n) {}
:nth-of-last-type(n) {}
- 偽元素選擇器:
:after {}
:before {}
- 屬性選擇器:
input[type="text"] {}
- 組合選擇器：
E,F/E F {} // 后代選擇器
/E>F {} // 子元素選擇器
/E+F {} // 直接相鄰元素選擇器----匹配之后的相鄰?fù)?jí)元素
/E~F {} // 普通相鄰元素選擇器----匹配之后的同級(jí)元素
- 層次選擇器
p~ul {} // 選擇前面有p元素的每個(gè)ul元素
選擇器區(qū)別
// 子選擇器作用于元素的第一代后代间坐，后代選擇器作用于元素的所有后代
ul>li {} // 子選擇器
div p {} // 后代選擇器
css選擇器優(yōu)先級(jí)：
- 選擇器優(yōu)先級(jí)由高到低分別為
!important > 作為style屬性寫在元素標(biāo)簽上的內(nèi)聯(lián)樣式 >id選擇器>類選擇器>偽類選擇器>屬性選擇器>標(biāo)簽選擇器> 通配符選擇器（* 應(yīng)少用）>瀏覽器自定義伙菊；
當(dāng)比較多個(gè)相同級(jí)別的CSS選擇器優(yōu)先級(jí)時(shí)碌尔，它們定義的位置將決定一切懒浮。下面從位置上將CSS優(yōu)先級(jí)由高到低分為六級(jí)：
1瑞凑、位于標(biāo)簽里的中所定義的CSS擁有最高級(jí)的優(yōu)先權(quán)腕巡。
2骚烧、第二級(jí)的優(yōu)先屬性由位于 標(biāo)簽中的 @import 引入樣式表所定義顶瞒。
3夸政、第三級(jí)的優(yōu)先屬性由標(biāo)簽所引入的樣式表定義。
4榴徐、第四級(jí)的優(yōu)先屬性由標(biāo)簽所引入的樣式表內(nèi)的 @import 導(dǎo)入樣式表定義守问。
5、第五級(jí)優(yōu)先的樣式有用戶設(shè)定坑资。
6耗帕、最低級(jí)的優(yōu)先權(quán)由瀏覽器默認(rèn)。
CSS哪些屬性可以繼承袱贮？
css繼承特性主要是指文本方面的繼承(比如字體仿便、顏色、字體大小等)，盒模型相關(guān)的屬性基本沒有繼承特性嗽仪。
不可繼承的：
display荒勇、margin、border闻坚、padding沽翔、background、height窿凤、min-height仅偎、max-height、width卷玉、min-width哨颂、max-width、overflow相种、position威恼、top、bottom寝并、left箫措、right、z-index衬潦、float斤蔓、clear、 table-layout镀岛、vertical-align弦牡、page-break-after、page-bread-before和unicode-bidi漂羊。
- 所有元素可繼承的：
visibility和cursor
- 終極塊級(jí)元素可繼承的：
text-indent和text-align
- 內(nèi)聯(lián)元素可繼承的：
letter-spacing驾锰、word-spacing、white-space走越、line-height椭豫、color、font旨指、font-family赏酥、font-size、font-style谆构、font-variant裸扶、font-weight、text-decoration搬素、text-transform姓言、direction
- 列表元素可繼承的：
list-style瞬项、list-style-type蔗蹋、list-style-position何荚、list-style-image
BFC布局規(guī)則：
內(nèi)部的Box會(huì)在垂直方向，一個(gè)接一個(gè)地放置猪杭。
Box垂直方向的距離由margin決定餐塘。屬于同一個(gè)BFC的兩個(gè)相鄰Box的margin會(huì)發(fā)生重疊
每個(gè)元素的margin box的左邊， 與包含塊border box的左邊相接觸(對(duì)于從左往右的格式化皂吮，否則相反)戒傻。即使存在浮動(dòng)也是如此。
BFC的區(qū)域不會(huì)與float box重疊蜂筹。
BFC就是頁(yè)面上的一個(gè)隔離的獨(dú)立容器需纳，容器里面的子元素不會(huì)影響到外面的元素。反之也如此艺挪。
計(jì)算BFC的高度時(shí)不翩，浮動(dòng)元素也參與計(jì)算
BFC的作用及原理：
自適應(yīng)兩欄布局
清除內(nèi)部浮動(dòng)
防止垂直 margin 重疊
BFC內(nèi)部的元素和外部的元素絕對(duì)不會(huì)互相影響，因此麻裳， 當(dāng)BFC外部存在浮動(dòng)時(shí)口蝠，它不應(yīng)該影響B(tài)FC內(nèi)部Box的布局，BFC會(huì)通過(guò)變窄津坑，而不與浮動(dòng)有重疊妙蔗。同樣的，當(dāng)BFC內(nèi)部有浮動(dòng)時(shí)疆瑰，為了不影響外部元素的布局眉反，BFC計(jì)算高度時(shí)會(huì)包括浮動(dòng)的高度。避免margin重疊也是這樣的一個(gè)道理穆役。
CSS函數(shù)有哪些寸五？
根據(jù)w3cplus中可以劃分為以下幾類
屬性函數(shù)：attr()；
背景圖片函數(shù)：linear-gradient()孵睬、radial-gradient()播歼、conic-gradient()、repeating-linear-gradient()掰读、repeating-radial-gradient()秘狞、repeating-conic-gradient()、image-set()蹈集、image()烁试、url()、element()拢肆；
顏色函數(shù)：rgb()减响、rgba()靖诗、hsl()、hsla()支示、hwb()刊橘、color-mod()；
圖形函數(shù)：circle()颂鸿、ellipse()促绵、inset()、polygon()嘴纺、path()
濾鏡函數(shù)：blur()败晴、brightness()、contrast()栽渴、drop-shadow()尖坤、grayscale()、hue-rotate()闲擦、invert()慢味、opacity()、saturate()佛致、sepia()贮缕；
轉(zhuǎn)換函數(shù)：matrix()、matrix3d()俺榆、perspective()感昼、rotate()、rotate3d()罐脊、rotateX()定嗓、rotateY()、rotateZ()萍桌、scale()宵溅、scale3d()、scaleX()上炎、scaleY()恃逻、scaleZ()、skew()藕施、skewX()寇损、skewY()、translate()裳食、translateX()矛市、translateY()、translateZ()诲祸、translate3d()浊吏；
數(shù)學(xué)函數(shù)：calc()而昨、min()、max()找田、mixmax()歌憨、repeat()；
緩動(dòng)函數(shù)：cubic-bezier()午阵、steps()躺孝；
其他函數(shù)：counter()、counters()底桂、toggle()、var()惧眠、 symbols()籽懦。
