[if !supportLists]1.1.?[endif]web前端面試之CSS3問題（碼動未來）
2.3.1、CSS3有哪些新特性？
新增各種CSS選擇器 ?（: not(.input)：所有 class 不是“input”的節(jié)點(diǎn)）
圓角（border-radius:8px）
多列布局（multi-column layout）
陰影和反射（Shadow\Reflect）
文字特效（text-shadow、）
文字渲染（Text-decoration）
線性漸變（gradient）
旋轉(zhuǎn)（transform）
增加了旋轉(zhuǎn),縮放,定位,傾斜,動畫，多背景
??transform:\scale(0.85,0.90)\ translate(0px,-30px)\ skew(-9deg,0deg)\Animation:
2.3.2、請解釋一下CSS3的Flexbox（彈性盒布局模型）,以及適用場景？
彈性盒布局模型的目的是提供一種更加有效的方式來對一個容器中的條目進(jìn)行排列、對齊和分配空白空間。即便容器中條目的尺寸未知或是動態(tài)變化的，彈性盒布局模型也能正常的工作。在該布局模型中，容器會根據(jù)布局的需要，調(diào)整其中包含的條目的尺寸和順序來最好地填充所有可用的空間。當(dāng)容器的尺寸由于屏幕大小或窗口尺寸發(fā)生變化時，其中包含的條目也會被動態(tài)地調(diào)整。比如當(dāng)容器尺寸變大時，其中包含的條目會被拉伸以占滿多余的空白空間；當(dāng)容器尺寸變小時，條目會被縮小以防止超出容器的范圍。彈性盒布局是與方向無關(guān)的。在傳統(tǒng)的布局方式中，block布局是把塊在垂直方向從上到下依次排列的；而 inline 布局則是在水平方向來排列。彈性盒布局并沒有這樣內(nèi)在的方向限制，可以由開發(fā)人員自由操作
2.3.3、::before和 :after中雙冒號和單冒號 有什么區(qū)別？解釋一下這2個偽元素的作用
單冒號(:)用于CSS3偽類，雙冒號(::)用于CSS3偽元素。
偽元素由雙冒號和偽元素名稱組成。雙冒號是在css3規(guī)范中引入的，用于區(qū)分偽類和偽元素。但是偽類兼容現(xiàn)存樣式，瀏覽器需要同時支持舊的偽類，比如:first-line、:first-letter、:before、:after等。
對于CSS2之前已有的偽元素，比如:before，單冒號和雙冒號的寫法::before作用是一樣的。
提醒，如果你的網(wǎng)站只需要兼容webkit、firefox、opera等瀏覽器，建議對于偽元素采用雙冒號的寫法，如果不得不兼容IE瀏覽器，還是用CSS2的單冒號寫法比較安全
::before就是以一個子元素的存在，定義在元素主體內(nèi)容之前的一個偽元素。但是并不存在于dom中，只是顯示在頁面上而已。同理，after就是在主體內(nèi)容之后顯示的
2.3.4、設(shè)置元素浮動后，該元素的display值是多少？
浮動元素自動設(shè)置為”block”元素，而不管他們之前是什么。這說明浮動元素上的{display: inline;}會被忽略，事實(shí)上所有的瀏覽器沒有呈現(xiàn)任何改變，包括IE
2.3.5、font-style屬性可以讓它賦值為“oblique” oblique是什么意思？
讓一種字體標(biāo)識為斜體(oblique)，如果沒有這種格式，就使用italic字體。這里描述所用的“oblique”和“italic”都是傾斜的意思。“oblique”在維基百科里的解釋就是一種排版術(shù)語，就是一種傾斜的文字，但不是斜體。一種字庫不能同時提供斜體和oblique兩種字體，因?yàn)閛blique基本上是一種模仿的斜體，而不是真正的斜體。所以，如果一種字庫里沒有提供斜體字，那當(dāng)使用CSS的font-style: italic時，瀏覽器實(shí)際上是按font-style: oblique顯示的。
2.3.6、position:fixed;在android下無效怎么處理
加入如下標(biāo)記
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>
2.3.7、CSS 選擇符有哪些？哪些屬性可以繼承？優(yōu)先級算法如何計算？ CSS3新增偽類有那些？
選擇符:
id選擇器（ # myid）
類選擇器（.myclassname）
標(biāo)簽選擇器（div, h1, p）
相鄰選擇器（h1 + p）
子選擇器（ul > li）
后代選擇器（li a）
通配符選擇器（*）
屬性選擇器（a[rel =“external”]）
偽類選擇器（a: hover, li: nth– child）
可繼承的樣式:
font-size font-family color, UL LI DL DD DT;
不可繼承的樣式：
border padding margin width height ;
優(yōu)先級算法:
優(yōu)先級就近原則，同權(quán)重情況下樣式定義最近者為準(zhǔn);
優(yōu)先級為:
!important > ?id > class > tag
important比 內(nèi)聯(lián)優(yōu)先級高
CSS3新增偽類:
p:first-of-type選擇屬于其父元素的首個元素的每個元素。
p:last-of-type選擇屬于其父元素的最后元素的每個元素。
p:only-of-type選擇屬于其父元素唯一的元素的每個元素。
p:only-child選擇屬于其父元素的唯一子元素的每個元素。
p:nth-child(2)選擇屬于其父元素的第二個子元素的每個元素。
:enabled :disabled控制表單控件的禁用狀態(tài)。
:checked單選框或復(fù)選框被選中。
QQ技術(shù)交流群:815302226
