1.什麼是盒模型？
盒模型主要分為w3c盒模型和ie盒模型，盒模型主要包括content，padding，border，margin。其中w3c盒模型的width=content，ie盒模型的width=content+padding+border。
2.flex
flex為彈性布局，webkit核心的瀏覽器必須要加上-webkit字首，flex容器的屬性有六種：
flex-direction：決定主軸的方向，預設重左到右
flex-wrap：決定子元素是否換行，預設不換行
flex-flow：flex-direction和flex-wrap的簡寫
justify-content：定義專案在主軸的對其方式
align-items：定義專案在交叉軸（副軸）上如何對齊
align-content：定義專案多軸的對齊方式
如何通過flex實現水平垂直居中？
.parent
3.css的單位
px：絕對單位，為css畫素
em：相對單位，以父節點字型大小為基準，如果自身設定了font-size，以自身的來計算。
rem：相對單位，以根節點的font-size為基準。
vw：視窗寬度，1vw=1%視窗寬度
vh：視窗高度，1vh=1%視窗高度
vmin：vw和vh中較小的那個
vmax：vw和vh中較大的那個
%：百分比
4.css選擇器
id選擇器，類選擇器，標籤選擇器，通用選擇器，後代選擇器，交集選擇器（注：ie7才可以相容），並集選擇器，偽類選擇器，子代選擇器（注：ie7才可以相容），序選擇器（例：ul li:first-child）(注：ie8才開始相容)
5.bfc清除浮動
.container.container::after
6.層疊上下文
設定z-index
7.**查詢
@media(max-width：300px){}//當文件寬度小於300px的時候匹配該樣式，相應式布局就是根據**查詢來做的
8.css3新特性2d和3d轉換
2d/3d：transform：進行2d轉化translate（平面移動），rotate（平面旋轉），scale（放大縮小），skew（傾斜），matrix（前面動畫的集合）；
translate3d，rotate3d，scale3d
9.css3過渡與動畫
過渡：transition：（使用時最好加webkit字首）
divdiv:hover
動畫：animation @keyframes
div@keyframes firstto}@-webkit-keyframes firstto}
10.display有哪些取值？
none，inline，block，inline-block，table，inline-table，list-item（li），flex
11.相鄰的兩個inline-block節點之間為什麼會出現間隔如何解決？
1.使用margin負值 2.取消inline-block標籤之間的空格
12.css實現寬度自適應100%，寬高為16：9的矩形
class="box">
class="
scale
">
class="
item
">
13.畫個三角形
div
前端面試題 css
1.實現不使用border畫出1px高的線，在不同瀏覽器的標準模式與怪異模式下都能保持一致的效果 2.介紹一下標準的css盒子模型，低版本的ie盒子模型有什麼不同 3.box sizing屬性 用來控制元素的盒子模型的解析模式。預設為content box 4.css選擇器有哪些？哪些屬性可以繼承？...
前端面試題 css
請將html模組中字型內容是 紅色 的字型顏色設定為 rgb 255,0,0 綠色 設定為 rgb 0,128,0 黑色 設定為 rgb 0,0,0 且字型大小都為20px。紅色 綠色黑色 請將html模組中ul列表的第2個li標籤和第4個li標籤的背景顏色設定成 rgb 255,0,0 請給htm...
前端面試題 css相關面試題
css 選擇器中，元素選擇器和類選擇器的區別是什麼？元素選擇器是最常見的 css 選擇器，即，文件的元素就是最基本的選擇器。選擇器通常是某個 html 元素，比如 等，甚至可以是 元素本身。類選擇器用於將樣式規則與附帶 class 屬性的元素匹配，其中該 class 屬性的值為類選擇器中指定的值。使...