介紹一下標準的CSS的盒子模型？
與低版本IE的盒子模型有什麼不同的？
標準盒子模型：寬度=內容的寬度（content）+ border + padding + margin
低版本IE,寬度=內容寬度（content+border+padding）+ margin
CSS哪些屬性可以繼承？
font-size, font-family, color
CSS哪些屬性不可以繼承？
border, padding, margin, width, height
box-sizing
用來控制元素的盒子模型的解析模式，默認爲content-box
設置元素的height/width屬性指的是border + padding + content部分的高/寬
CSS選擇器有哪些(9)
- id選擇器(#myid)
- 類選擇器(.myclassname)
- 標籤選擇器(div, h1, p)
- 相鄰選擇器(h1 + p)
- 子選擇器（ul > li）
- 後代選擇器（li a）
- 通配符選擇器（*）
- 屬性選擇器（a[rel=”external”]）
- 僞類選擇器（a:hover, li:nth-child）
優先級原則
優先級（就近原則）：
!important > [ id > class > tag ]
!important 比內聯優先級高
優先級計算
元素選擇符 1
class選擇符 10
id選擇符 10
標籤選擇符 1000
style 行內 1000
!important infinity 無限
CSS3僞類選擇器有那些(5)
- 動態僞類選擇器
E:link（鏈接僞類選擇器）：選擇匹配的E元素，而且匹配元素被定義了超鏈接並未被訪問過。常用於鏈接描點上
E:visited（鏈接僞類選擇器 ）：選擇匹配的E元素，而且匹配元素被定義了超鏈接並已被訪問過。常用於鏈接描點上
E:active（用戶行爲選擇器）：選擇匹配的E元素，且匹配元素被激活。常用於鏈接描點和按鈕上
E:hover （用戶行爲選擇器）： 選擇匹配的E元素，且用戶鼠標停留在元素E上。IE6及以下瀏覽器僅支持a:hover
E:focus （用戶行爲選擇器）： 選擇匹配的E元素，而且匹配元素獲取焦點
- UI元素狀態僞類選擇器
E:checked（選中狀態僞類選擇器）：匹配選中的複選按鈕或者單選按鈕表單元素
E:enabled（啓用狀態僞類選擇器 ）：匹配所有啓用的表單元素
E:disabled（不可用狀態僞類選擇器）：匹配所有禁用的表單元素
- a標籤有4種僞類（即對應四種狀態）
:link “鏈接”：超鏈接點擊之前
:visited “訪問過的”：鏈接被訪問過之後
:hover “懸停”：鼠標放到標籤上的時候
:active “激活”： 鼠標點擊標籤，但是不鬆手時。
- 結構僞類選擇器
E:fisrt-child ：作爲父元素的第一個子元素的元素E。與E:nth-child(1)等同
E:last-child ：作爲父元素的最後一個子元素的元素E。與E:nth-last-child(1)等同
E:root：選擇匹配元素E所在文檔的根元素。在HTML文檔中，根元素始終是html，此時該選擇器與html類型選擇器匹配的內容相同
E F:nth-child(n)：選擇父元素E的第n個子元素F。其中n可以是整數（1，2，3）、關鍵字（even，odd）、可以是公式（2n+1）,而且n值起始值爲1，而不是0.
E F:nth-last-child(n)：選擇父元素E的倒數第n個子元素F。此選擇器與E:nth-child(n)選擇器計算順序剛好相反，但使用方法都是一樣的，其中：nth-last-child(1)始終匹配最後一個元素，與last-child等同
E:nth-of-type(n) ：選擇父元素內具有指定類型的第n個E元素
E:nth-last-of-type(n)：選擇父元素內具有指定類型的倒數第n個E元素
E:first-of-type：選擇父元素內具有指定類型的第一個E元素，與E:nth-of-type(1)等同
E:last-of-tye ：選擇父元素內具有指定類型的最後一個E元素，與E:nth-last-of-type(1)等同
E:only-child ：選擇父元素只包含一個子元素，且該子元素匹配E元素
E:only-of-type：選擇父元素只包含一個同類型子元素，且該子元素匹配E元素
E:empty： 選擇沒有子元素的元素，而且該元素也不包含任何文本節點
- 否定僞類選擇器
E:not(F)：匹配所有除元素F外的E元素
display有哪些值？說明他們的作用?
display:none;
inline（默認）–內聯
none–隱藏
block–塊顯示
table–表格顯示
list-item–項目列表
inline-block
position的值？
static（默認）：按照正常文檔流進行排列；
relative（相對定位）：不脫離文檔流，參考自身靜態位置通過 top, bottom, left, right 定位；
absolute(絕對定位)：參考距其最近一個不爲static的父級元素通過top, bottom, left, right 定位；
fixed(固定定位)：所固定的參照對像是可視窗口。
如何清除浮動？
如何清除定位？
CSS3有哪些新特性
RGBA和透明度
background-image background-origin(content-box/padding-box/border-box) background-size background-repeat
word-wrap（對長的不可分割單詞換行）word-wrap：break-word
文字陰影：text-shadow： 5px 5px 5px #FF0000;（水平陰影，垂直陰影，模糊距離，陰影顏色）
font-face屬性：定義自己的字體
圓角（邊框半徑）：border-radius 屬性用於創建圓角
邊框圖片：border-image: url(border.png) 30 30 round
盒陰影：box-shadow: 10px 10px 5px #888888
媒體查詢：定義兩套css，當瀏覽器的尺寸變化時會採用不同的屬性
CSS3的flexbox（彈性盒佈局模型）
css 監聽動畫效果
Vue 中的
vue 如何監聽css動畫結束的animationEnd事件
this.$refs.item_box[0].addEventListener("animationend",function(){});