1、用純CSS建立一個三角形的原理是什麼？
答案：首先，需要把元素的寬度、高度設為0。然後設定邊框樣式。
width: 0;height: 0;
border-top: 40px solid transparent; border-left: 40px solid transparent;
border-right: 40px solid transparent; border-bottom: 40px solid #ff0000;
2、為什麼要初始化CSS樣式
答案：因為瀏覽器的相容問題，不同瀏覽器對有些標籤的預設值是不同的，如果沒對CSS初始化往往會出現瀏覽器之間的頁面顯示差異。
3、CSS裡的visibility屬性有個collapse屬性值？在不同瀏覽器下以後什麼區別？
答案：當一個元素的visibility屬性被設定成collapse值後，對於一般的元素，它的表現跟hidden是一樣的。
chrome中，使用collapse值和使用hidden沒有區別。
firefox，opera和IE，使用collapse值和使用display：none沒有什麼區別。
4、在網頁中的應該使用奇數還是偶數的字型？為什麼呢？
答案：使用偶數字體。偶數字號相對更容易和 web 設計的其他部分構成比例關係。Windows 自帶的點陣宋體（中易宋體）從 Vista 開始只提供 12、14、16 px 這三個大小的點陣，而 13、15、17 px時用的是小一號的點。（即每個字佔的空間大了 1 px，但點陣沒變），於是略顯稀疏。
5、元素豎向的百分比設定是相對於容器的高度嗎？
答案：當按百分比設定一個元素的寬度時，它是相對於父容器的寬度計算的，但是，對於一些表示豎向距離的屬性，例如 padding-top , padding-bottom , margin-top , margin-bottom 等，當按百分比設定它們時，依據的也是父容器的寬度，而不是高度。
6、html5哪些操作可以SEO最佳化？
title標籤；meta標籤；header標籤；footer標籤
元標籤（meta標籤）；導航標籤（nav標籤）；文章標籤（article標籤）；左或右側標籤（aside標籤）
7、簡述對Web語義化的理解？
就是讓瀏覽器更好的讀懂你寫的程式碼，在進行HTML結構、表現、行為設計時，儘量使用語義化的標籤，使程式程式碼簡潔明瞭，易於進行web操作和網站SEO，方便團隊的一種標準，以圖實現一種“無障礙”的web開發。
8、box-sizing、transition、translate分別是什麼？
a. box-sizing:用來指定模型的大小的計算方式。主要分為border-box(從邊框固定盒子大小)、content-box(從內容固定盒子大小)兩種計算方式。
b. transition:當前元素只要有"屬性"發生變化時，可以平滑的進行過渡。透過transition-propety設定過渡屬性；transition-duration設定過渡時間；transition-timing-function設定過渡速度；transition-delay設定過渡延時。
c. translate：透過移動改變元素的位置；有x,y,z三個屬性
9、html中 document的作用是什麼？
HTML即：超文字標記語言，標準通用標記語言的一個應用，“超文字”就是指頁面內可以包含圖片、連結、甚至音樂、程式等非文字元素。
HTML Document即：HTML Document物件，每個載入瀏覽器的HTML文件都會成為Document物件
由於Document物件是window物件的一部分，所以可透過window.document屬性對其進行訪問。
10、談談你對前端效能最佳化的理解
a. 請求數量：合併指令碼和樣式表，CSS Sprites，拆分初始化負載，劃分主域
b. 請求頻寬：開啟GZip，精簡JavaScript，移除重複指令碼，影像最佳化，將icon做成字型
c. 快取利用：使用CDN，使用外部JavaScript和CSS，新增Expires頭，減少DNS查詢，配置ETag，使AjaX可快取
d. 頁面結構：將樣式表放在頂部，將指令碼放在底部，儘早重新整理文件的輸出
e. 程式碼校驗：避免CSS表示式，避免重定向