1.前端頁面有哪三層構(gòu)成，分別是什么?
前端頁面主要由以下三層構(gòu)成：
頁面結(jié)構(gòu)層：HTML治力，分為HTML4.0和HTML5.0兩個版本
頁面表示層：CSS攘滩，分為CSS2.0和CSS3.0版本
頁面行為層：JavaScript汪拥，頁面的腳本層
2.HTML與XHTML——二者有什么區(qū)別
1）文檔結(jié)構(gòu)
XHTML中的 <!DOCTYPE> 是強制性的
HTML中的 XML namespace 屬性是強制性的，<html>、<head>、<title>以及 <body>標(biāo)簽也是強制必須存在的文檔結(jié)構(gòu)標(biāo)記。
2）元素語法
XHTML 元素必須正確嵌套
XHTML 元素必須始終關(guān)閉
XHTML 元素必須小寫
XHTML 文檔必須有一個根元素
3）屬性語法
XHTML 屬性必須使用小寫
XHTML 屬性值必須用引號包圍
XHTML 屬性最小化也是禁止的
3.對WEB標(biāo)準(zhǔn)以及W3C的理解與認(rèn)識
網(wǎng)頁主要由三個部分組成绢馍，表現(xiàn)、結(jié)構(gòu)和行為忍宋。
其中：
1）HTML是網(wǎng)頁的結(jié)構(gòu)和內(nèi)容
2）CSS是網(wǎng)頁的表現(xiàn)
3）JavaScript是網(wǎng)頁的行為動作
以上這三個東西就形成了一個完整的網(wǎng)頁痕貌，但是js改變時风罩，會造成css和html的混亂糠排，讓這三個的界限不是那么清晰。這個時候超升，WEB標(biāo)準(zhǔn)就出來了入宦，WEB標(biāo)準(zhǔn)一般是將這三部分獨立分開，使其更具有模塊化室琢。
W3C一般指萬維網(wǎng)聯(lián)盟乾闰，是Web技術(shù)領(lǐng)域最具權(quán)威和影響力的國際中立性技術(shù)標(biāo)準(zhǔn)機構(gòu)，對Web標(biāo)準(zhǔn)提出了規(guī)范化的要求盈滴，也就是在實際編程中的一些代碼規(guī)范：包含如下幾點：
1）對于結(jié)構(gòu)要求：（標(biāo)簽規(guī)范可以提高搜索引擎對頁面的抓取效率涯肩，對SEO很有幫助）
標(biāo)簽字母要小寫
標(biāo)簽要閉合
標(biāo)簽不允許隨意嵌套
2）對于CSS和JavaScript來說
盡量使用外鏈CSS樣式表和JavaScript腳本轿钠。使結(jié)構(gòu)、表現(xiàn)和行為分為三塊病苗，符合規(guī)范疗垛。同時提高頁面渲染速度，提高用戶的體驗硫朦。
樣式盡量少用行間樣式表贷腕，使結(jié)構(gòu)與表現(xiàn)分離，標(biāo)簽的id和class等屬性命名要做到見文知義咬展，標(biāo)簽越少泽裳，加載越快，用戶體驗提高破婆，代碼維護簡單涮总，便于改版。
4.以前端角度出發(fā)做好SEO需要考慮什么祷舀？
1）什么是SEO妹卿？
SEO也就是Search Engine Optimization，搜索引擎優(yōu)化蔑鹦。指的是通過對網(wǎng)站節(jié)后以及內(nèi)容的調(diào)整優(yōu)化網(wǎng)站的搜索夺克，比如網(wǎng)站的推廣、網(wǎng)站對客戶的吸引度嚎朽，網(wǎng)站品牌的建設(shè)铺纽，關(guān)鍵字搜索的排名等都會受到SEO的影響。
做好SEO哟忍，需要考慮到一些搜索引擎的基本工作原理狡门，各個搜索引擎之間的區(qū)別，搜索機器人（SE robot 或叫 web crawler）如何進行工作锅很，搜索引擎如何對搜索結(jié)果進行排序等等其馏。
2）可以從哪些方面入手提高SEO？
1.Meta標(biāo)簽優(yōu)化
主要包括主題（Title)爆安，網(wǎng)站描述(Description)叛复，和關(guān)鍵詞（Keywords）。還有一些其它的隱藏文字比如Author（作者）扔仓，Category（目錄）褐奥，Language（編碼語種）等。
2.如何選取關(guān)鍵詞并在網(wǎng)頁中放置關(guān)鍵詞
搜索就得用關(guān)鍵詞翘簇。關(guān)鍵詞分析和選擇是SEO最重要的工作之一撬码。首先要給網(wǎng)站確定主關(guān)鍵詞（一般在5個上下），然后針對這些關(guān)鍵詞進行優(yōu)化版保，包括關(guān)鍵詞密度（Density）呜笑，相關(guān)度（Relavancy）夫否，突出性（Prominency）等等。
3.了解主要的搜索引擎
雖然搜索引擎有很多叫胁，但是對網(wǎng)站流量起決定作用的就那么幾個慷吊。比如英文的主要有Google，Yahoo曹抬，Bing等溉瓶；中文的有百度，搜狗谤民，有道等堰酿。不同的搜索引擎對頁面的抓取和索引、排序的規(guī)則都不一樣张足。還要了解各搜索門戶和搜索引擎之間的關(guān)系触创，比如AOL網(wǎng)頁搜索用的是Google的搜索技術(shù)，MSN用的是Bing的技術(shù)为牍。
4.主要的互聯(lián)網(wǎng)目錄
Open Directory自身不是搜索引擎哼绑，而是一個大型的網(wǎng)站目錄，他和搜索引擎的主要區(qū)別是網(wǎng)站內(nèi)容的收集方式不同碉咆。目錄是人工編輯的抖韩，主要收錄網(wǎng)站主頁；搜索引擎是自動收集的疫铜，除了主頁外還抓取大量的內(nèi)容頁面茂浮。
5.按點擊付費的搜索引擎
搜索引擎也需要生存，隨著互聯(lián)網(wǎng)商務(wù)的越來越成熟壳咕，收費的搜索引擎也開始大行其道席揽。最典型的有Overture和百度，當(dāng)然也包括Google的廣告項目Google Adwords谓厘。越來越多的人通過搜索引擎的點擊廣告來定位商業(yè)網(wǎng)站幌羞，這里面也大有優(yōu)化和排名的學(xué)問，你得學(xué)會用最少的廣告投入獲得最多的點擊
6.搜索引擎登錄
網(wǎng)站做完了以后竟稳，別躺在那里等著客人從天而降属桦。要讓別人找到你，最簡單的辦法就是將網(wǎng)站提交（submit）到搜索引擎住练。如果你的是商業(yè)網(wǎng)站地啰，主要的搜索引擎和目錄都會要求你付費來獲得收錄（比如Yahoo要299美元），但是好消息是（至少到目前為止）最大的搜索引擎Google目前還是免費讲逛，而且它主宰著60％以上的搜索市場。
7.鏈接交換和鏈接廣泛度（Link Popularity）
網(wǎng)頁內(nèi)容都是以超文本（Hypertext）的方式來互相鏈接的岭埠，網(wǎng)站之間也是如此盏混。除了搜索引擎以外蔚鸥，人們也每天通過不同網(wǎng)站之間的鏈接來Surfing（“沖浪”）。其它網(wǎng)站到你的網(wǎng)站的鏈接越多许赃，你也就會獲得更多的訪問量止喷。更重要的是，你的網(wǎng)站的外部鏈接數(shù)越多混聊，會被搜索引擎認(rèn)為它的重要性越大弹谁，從而給你更高的排名。
5.什么是微格式
微格式（Microformats）是一種讓機器可讀的語義化 XHTML 詞匯的集合句喜，是結(jié)構(gòu)化數(shù)據(jù)的開放標(biāo)準(zhǔn)预愤。是為特殊應(yīng)用而制定的特殊格式。
通俗的講咳胃，就是為現(xiàn)有的XHTML元素添加元數(shù)據(jù)和其他屬性植康，增強其語義，方便網(wǎng)站搜索引擎展懈。
rel
<a href="xx.html" rel="homepage">這是一個測試連接</a>
<a>標(biāo)簽更加直觀易讀销睁，也易于搜索
6.市面上常用瀏覽器的內(nèi)核分別是什么
瀏覽器內(nèi)核又可以分成兩部分：渲染引擎和 JS 引擎。渲染引擎負(fù)責(zé)取得網(wǎng)頁的內(nèi)容（HTML存崖、XML冻记、圖像等等）、整理訊息（例如加入 CSS 等）来惧，以及計算網(wǎng)頁的顯示方式檩赢，然后會輸出至顯示器或打印機。而JS 引擎則是解析 JavaScript 語言违寞，執(zhí)行 JavaScript 語言來實現(xiàn)網(wǎng)頁的動態(tài)效果贞瞒。
我們常用的瀏覽有如下幾種：
IE: trident內(nèi)核
Firefox：gecko內(nèi)核
Safari：webkit內(nèi)核
Opera:以前是presto內(nèi)核，Opera現(xiàn)已改用Google Chrome的Blink內(nèi)核
Chrome:Blink(基于webkit趁曼，Google與Opera Software共同開發(fā))
7.img的alt與title有何異同
alt：alt屬性用來指定圖片無法正確顯示時的替換文字军浆。
title：title屬性為設(shè)置該屬性的元素提供建議性的信息，一般作為圖片提示信息挡闰。
src：src屬性是指明圖片的引用路徑乒融。
<img src="show.jpg" alt="該圖片無法顯示" title="點擊圖片可以查看詳情">
8.Canvas和SVG
使用JavaScript來繪制圖形的簡單而強大的方法∩忝酰可以用于繪制圖形赞季，合成制作照片或做動畫。
Canvas
依賴分辨率
不支持事件處理器
弱的文本渲染能力
能夠以 .png 或 .jpg 格式保存結(jié)果圖像
最適合圖像密集型的游戲奢驯，其中的許多對象會被頻繁重繪
SVG
不依賴分辨率
支持事件處理器
最適合帶有大型渲染區(qū)域的應(yīng)用程序（如谷歌地圖）
復(fù)雜度高會減慢渲染速度
不適合游戲應(yīng)用
9.<iframe>的優(yōu)缺點
優(yōu)點：
1）解決加載緩慢的第三方內(nèi)容如圖標(biāo)和廣告等的加載問題
2）可以將重復(fù)的內(nèi)容被提取到子頁面中申钩，在主頁中使用<iframe>標(biāo)記將其引入
3）并行加載腳本
缺點：
1）<iframe>會阻塞主頁面的Onload事件
2）即時內(nèi)容為空，加載也需要時間
3）沒有語意
10.HTML5的新特性有哪些
拖拽釋放(Drag and drop) API
語義化更好的內(nèi)容標(biāo)簽（header,nav,footer,aside,article,section）
多媒體標(biāo)簽audio,video可以在頁面直接添加音視頻
畫布Canvas瘪阁、svg是實現(xiàn)前端數(shù)據(jù)可視化必不可少的東西
地理(Geolocation) API
本地離線存儲 localStorage撒遣，可長期存儲數(shù)據(jù)邮偎，瀏覽器關(guān)閉后數(shù)據(jù)不丟失
sessionStorage 的數(shù)據(jù)在瀏覽器關(guān)閉后自動刪除
表單控件：calendar、date义黎、time禾进、email、url廉涕、search
新的技術(shù)webworker泻云、websocket、Geolocation
其中畫布和地理api狐蜕，本地存儲用的比較的多宠纯。
12.cookie,sessionstorage,localStorage的區(qū)別
共同點：都是保存在瀏覽器端
區(qū)別：
1） 數(shù)據(jù)的存儲及大小限制不同
cookie數(shù)據(jù)始終在同源的http請求中攜帶（即使不需要），即cookie在瀏覽器和服務(wù)器間來回傳遞馏鹤；
cookie數(shù)據(jù)大小不能超過4k征椒，同時因為每次http請求都會攜帶cookie，所以cookie只適合保存很小的數(shù)據(jù)湃累，如會話標(biāo)識勃救。
而sessionStorage和localStorage不會自動把數(shù)據(jù)發(fā)給服務(wù)器，僅在本地保存治力。sessionStorage和localStorage 雖然也有存儲大小的限制蒙秒，但比cookie大得多，可以達(dá)到5M或更大宵统。
2） 數(shù)據(jù)有效期不同
sessionStorage：僅在當(dāng)前瀏覽器窗口關(guān)閉前有效晕讲，自然也就不可能持久保持；
localStorage：始終有效马澈，窗口或瀏覽器關(guān)閉也一直保存瓢省，因此用作持久數(shù)據(jù)；
cookie只在設(shè)置的cookie過期時間之前一直有效痊班，即使窗口或瀏覽器關(guān)閉勤婚。
3） 作用域不同
sessionStorage不在不同的瀏覽器窗口中共享，即使是同一個頁面涤伐；
localStorage 在所有同源窗口中都是共享的馒胆；
cookie也是在所有同源窗口中都是共享的。
13.CSS3的新特性有哪些
1）先從顛覆性的屬性開始比如：rotate(旋轉(zhuǎn))凝果，translate(位移)祝迂，scale(縮放)等
2）Css3的動畫 animation
3）還有css3的過渡， transition: all 1s
4）再列舉一些簡單的屬性比如說: border-radius(圓角)器净，box-shadow(盒子陰影)型雳，border-shadow(邊框陰影)等
5）新增了結(jié)構(gòu)偽類選擇器，像 first-child，nth-child(n)之類的
6）先從顛覆性的屬性開始比如：rotate(旋轉(zhuǎn))四啰，translate(位移)宁玫，scale(縮放)等
14.常見的幾種頁面布局方式
1） Flex彈性盒子
flex布局又稱彈性盒子粗恢，簡單代碼量少柑晒，使用flex布局可以不用左右浮動。
Flexbox布局在定義伸縮項目大小時伸縮容器會預(yù)留一些可用空間眷射，讓你可以調(diào)節(jié)伸縮項目的相對大小和位置匙赞。例如，你可以確保伸縮容器中的多余空間平均分配多個伸縮項目妖碉，當(dāng)然涌庭，如果你的伸縮容器沒有足夠大的空間放置伸縮項目時，瀏覽器會根據(jù)一定的比例減少伸縮項目的大小欧宜，使其不溢出伸縮容器坐榆。綜合而言，F(xiàn)lexbox布局功能主要具有以下幾點：
第一冗茸，屏幕和瀏覽器窗口大小發(fā)生改變也可以靈活調(diào)整布局席镀；
第二，可以指定伸縮項目沿著主軸或側(cè)軸按比例分配額外空間（伸縮容器額外空間）夏漱，從而調(diào)整伸縮項目的大泻阑濉；
第三挂绰，可以指定伸縮項目沿著主軸或側(cè)軸將伸縮容器額外空間屎篱，分配到伸縮項目之前、之后或之間葵蒂；
第四交播，可以指定如何將垂直于元素布局軸的額外空間分布到該元素的周圍；
第五践付，可以控制元素在頁面上的布局方向秦士；
第六，可以按照不同于文檔對象模型（DOM）所指定排序方式對屏幕上的元素重新排序荔仁。也就是說可以在瀏覽器渲染中不按照文檔流先后順序重排伸縮項目順序伍宦。
2）rem布局
rem根據(jù)頁面寬度和的頁面的根元素來控制大小，是移動端布局的常用方式之一乏梁。
3）響應(yīng)式布局
響應(yīng)式布局次洼，一套代碼適應(yīng)pc和移動端，設(shè)置好幾個尺寸分別的樣式遇骑，根據(jù)頁面的寬度來改變樣式卖毁。
4）流式布局
流式布局也叫百分比布局。元素的寬、高亥啦、margin炭剪、padding不再用固定數(shù)值，改用百分比翔脱，這樣元素的高奴拦、margin、padding 會根據(jù)頁面的尺寸隨時調(diào)整届吁，以達(dá)到適應(yīng)當(dāng)前頁面的目的错妖。
◆ 百分比是基于元素父級的大小計算得來的；
◆ 元素的水平或者豎直間距都是相對于父級的寬度計算的.(margin&padding)疚沐；
◆ 邊框不能用百分比設(shè)置暂氯。
5）浮動布局
浮動布局關(guān)鍵詞，float亮蛔，可以設(shè)置left或者right痴施，他使元素脫離文檔流進而達(dá)到布局的目的，也是目前一個比較主流的布局方式究流，但是使用浮動結(jié)束以后辣吃，別忘記清除浮動。
6）定位布局
定位布局也是目前比較常用的一種布局方式梯嗽，關(guān)鍵詞： position: fixed;
7）固定布局
固定布局齿尽，即將元素固定在一個位置，不隨頁面移動而移動灯节。
position: relative;相對定位循头，相對于元素自身定位，不脫離文檔流炎疆，相當(dāng)于定義一個參照物卡骂，一般和絕對定位結(jié)合使用；
position: absolute;絕對定位形入，脫離文檔流全跨，一般和相對定位結(jié)合使用，如果不定義相對定位亿遂，將會相對于整個瀏覽器定位浓若，所以定位布局，一般情況下都是相對定位和絕對定位結(jié)合著來蛇数，相對定位相當(dāng)于劃定一個勢力范圍挪钓，制定一個封閉的容器塊，然后絕對定位就相對于相對定位來定位耳舅，從而達(dá)到有效的布局碌上。
15.src與href的區(qū)別
src是source的縮寫，指向外部資源的位置，例如js腳本馏予，img圖片和frame等
href是Hypertext Reference的縮寫天梧，指向網(wǎng)絡(luò)資源所在位置
16.css動畫和js動畫的差異
1.JS動畫
缺點
1）JavaScript在瀏覽器的主線程中運行，而主線程中還有其它需要運行的JavaScript腳本霞丧、樣式計算呢岗、布局、繪制任務(wù)等蚯妇，對其干擾可能會導(dǎo)致線程出現(xiàn)阻塞敷燎，從而造成丟幀的情況暂筝。
2）代碼的復(fù)雜度高于CSS動畫箩言。
優(yōu)點
1）JavaScript動畫控制能力很強, 可以在動畫播放過程中對動畫進行控制：開始、暫停焕襟、回放陨收、終止、取消都是可以做到的鸵赖。
2）動畫效果比css3動畫豐富务漩，有些動畫效果，比如曲線運動它褪、沖擊閃爍饵骨、視差滾動效果，只有JavaScript動畫才能完成茫打。
3）CSS3有兼容性問題居触，而JS大多時候沒有兼容性問題。
2.CSS動畫
缺點
1）運行過程控制較弱老赤，無法附加事件綁定回調(diào)函數(shù)轮洋。CSS動畫只能暫停，不能在動畫中尋找一個特定的時間點抬旺，不能在半路反轉(zhuǎn)動畫弊予，不能變換時間尺度，不能在特定的位置添加回調(diào)函數(shù)或是綁定回放事件开财，無進度報告汉柒。
2）代碼冗長。如果想用 CSS 實現(xiàn)稍微復(fù)雜一點動畫责鳍，最后CSS代碼都會變得非常笨重碾褂。
優(yōu)點
瀏覽器可以對動畫進行優(yōu)化。
瀏覽器使用與 requestAnimationFrame 類似的機制薇搁，requestAnimationFrame比起setTimeout斋扰，setInterval設(shè)置動畫的優(yōu)勢主要是：
A）requestAnimationFrame 會把每一幀中的所有DOM操作集中起來，在一次重繪或回流中就完成，并且重繪或回流的時間間隔緊緊跟隨瀏覽器的刷新頻率传货，一般來說,這個頻率為每秒60幀屎鳍。
B）在隱藏或不可見的元素中，requestAnimationFrame不會進行重繪或回流问裕，這當(dāng)然就意味著更少的的cpu逮壁，gpu和內(nèi)存使用量。
17.css是什么粮宛？安裝使用的步驟是窥淆？有哪幾大特性?
1）scss是什么？
scss是css的預(yù)編譯巍杈。
2）scss安裝使用步驟
第一步：用npm下三個loader(sass-loader忧饭、css-loader、node-sass)筷畦；
第二步：在build目錄找到webpack.base.config.js词裤，在那個extends屬性中加一個拓展.scss；
第三步：還是在同一個文件鳖宾，配置一個module屬性吼砂；
第四步：然后在組件的style標(biāo)簽加上lang屬性，例如：lang="scss"鼎文；
3）scss有哪幾大特性?
1.可以用變量渔肩，例如（$變量名稱=值）；
2.可以用混合器拇惋；
3.可以嵌套周偎；
18.有多少種清除浮動的方法
方式一：使用overflow屬性來清除浮動。
方式二：使用額外標(biāo)簽法蚤假，在浮動的盒子之下再放一個標(biāo)簽栏饮，在這個標(biāo)簽中使用clear:both，來清除浮動對頁面的影響磷仰，弊端會增加頁面的標(biāo)簽袍嬉，造成結(jié)構(gòu)的混亂
方法三：使用偽元素來清除浮動(after)
方法四：使用雙偽元素清除浮動
19.瀏覽器是如何渲染頁面的？
1）解析HTML文件灶平，創(chuàng)建DOM樹伺通。
自上而下，遇到任何樣式（link逢享、style）與腳本（script）都會阻塞（外部樣式不阻塞后續(xù)外部腳本的加載）罐监。
2）解析CSS。
優(yōu)先級：瀏覽器默認(rèn)設(shè)置<用戶設(shè)置<外部樣式<內(nèi)聯(lián)樣式
3）將CSS與DOM合并瞒爬，構(gòu)建渲染樹（Render Tree）
4）布局和繪制弓柱，重繪（repaint）和重排（reflow）
20.簡述從瀏覽器地址欄輸入url到顯示頁面的步驟沟堡？
1、在瀏覽器地址欄輸入URL
2矢空、瀏覽器查看緩存航罗，如果請求資源在緩存中并且新鮮，跳轉(zhuǎn)到轉(zhuǎn)碼步驟
3屁药、瀏覽器解析URL獲取協(xié)議粥血，主機，端口酿箭，path
4复亏、瀏覽器組裝一個HTTP（GET）請求報文
5、瀏覽器獲取主機ip地址缭嫡，過程如下：
1）瀏覽器緩存
2）本機緩存
3）hosts文件
4）路由器緩存
5）ISP DNS緩存
6）DNS遞歸查詢（可能存在負(fù)載均衡導(dǎo)致每次IP不一樣）
6缔御、打開一個socket與目標(biāo)IP地址，端口建立TCP連接
7械巡、TCP連接建立后發(fā)送HTTP請求
8刹淌、服務(wù)器接受請求并解析，將請求轉(zhuǎn)發(fā)到服務(wù)程序讥耗，如虛擬主機使用HTTP Host頭部判斷請求的服務(wù)程序
9、服務(wù)器檢查HTTP請求頭是否包含緩存驗證信息疹启，如果驗證緩存新鮮古程，返回304等對應(yīng)狀態(tài)碼
10、處理程序讀取完整請求并準(zhǔn)備HTTP響應(yīng)喊崖，可能需要查詢數(shù)據(jù)庫等操作
11挣磨、服務(wù)器將響應(yīng)報文通過TCP連接發(fā)送回瀏覽器
12、瀏覽器接收HTTP響應(yīng)荤懂，然后根據(jù)情況選擇關(guān)閉TCP連接或者保留重用茁裙，關(guān)閉TCP連接
13、瀏覽器檢查響應(yīng)狀態(tài)碼：是否為1XX节仿，3XX晤锥， 4XX， 5XX廊宪，這些情況處理與2XX不同
14矾瘾、如果資源可緩存，進行緩存
15箭启、對響應(yīng)進行解碼（例如gzip壓縮）
16壕翩、根據(jù)資源類型決定如何處理（這里假設(shè)資源為HTML文檔）
17、解析HTML文檔傅寡，構(gòu)件DOM樹放妈，下載資源北救，構(gòu)造CSSOM樹，執(zhí)行js腳本
18芜抒、構(gòu)建DOM樹
19扭倾、解析過程中遇到圖片、樣式表挽绩、js文件膛壹，啟動下載
20、構(gòu)建CSSOM樹
21唉堪、js解析
22模聋、顯示頁面（HTML解析過程中會逐步顯示頁面）
21.前端如何進行項目優(yōu)化？
減少請求數(shù)
1）合并樣式唠亚、腳本文件
2）合并背景圖片
3）CSS3圖標(biāo)链方、Icon Font
降低請求量
1）開啟GZip
2）優(yōu)化靜態(tài)資源，jQuery->Zepto灶搜、閹割I(lǐng)Scroll祟蚀、去除冗余代碼
3）圖片無損壓縮
4）圖片延遲加載
5）減少Cookie攜帶
22.CSS有哪些選擇器？
派生選擇器（用HTML標(biāo)簽申明）
id選擇器（用DOM的ID申明）
類選擇器（用一個樣式類名申明）
屬性選擇器（用DOM的屬性申明割卖，屬于CSS2前酿，IE6不支持，不常用鹏溯，不知道就算了）
除了前3種基本選擇器罢维，還有一些擴展選擇器，包括
后代選擇器（利用空格間隔丙挽，比如div .a{ }）
群組選擇器（利用逗號間隔肺孵，比如p,div,#a{ }）
23.設(shè)置DOM的CSS樣式有幾種方法？
CSS樣式設(shè)置有三種方式：
外部樣式表颜阐，引入一個外部css文件
內(nèi)部樣式表平窘，將CSS代碼放在 <head> 標(biāo)簽內(nèi)部
內(nèi)聯(lián)樣式，將CSS樣式直接定義在 HTML 元素內(nèi)部
如果這三種樣式同時作用于DOM凳怨，優(yōu)先級為：內(nèi)聯(lián)樣式>內(nèi)部樣式>外部樣式
24.CSS3中新增的動畫效果
1瑰艘、定義動畫
@keyframes 動畫名{
from{}
to{}
}
2、用動畫屬性 animation：動畫名 時長 infinite;(簡化設(shè)置屬性)
animation-name 動畫名稱
animation-duration 動畫時長
animation-delay 拖延時間
animation-timing-function 變化曲線
animation-iteration-count: 1 n infinite(無限次)
3猿棉、transform
移動 transform:translate(x軸移動像素,y軸移動像素)
縮放 transform：scale(寬度比例磅叛，高度比例)
旋轉(zhuǎn) transform:rotate(旋轉(zhuǎn)的度數(shù) deg)
拉長 transform：skew(x軸翻轉(zhuǎn)度數(shù) deg,y軸翻轉(zhuǎn)度數(shù) deg)
transform：rotateX(旋轉(zhuǎn)度數(shù)deg) : 以x方向為軸，翻轉(zhuǎn)
transform：rotateY(旋轉(zhuǎn)度數(shù)deg) : 以y方向為軸萨赁，翻轉(zhuǎn)
25.前端應(yīng)該如何高質(zhì)量完成工作?
1）首先劃分成header弊琴、body、footer
2）實現(xiàn)效果圖是最基本的工作杖爽，精確到2px敲董；
3）與設(shè)計師紫皇，產(chǎn)品經(jīng)理的溝通和項目的參與
4）做好的頁面結(jié)構(gòu)，頁面重構(gòu)和用戶體驗
5）處理hack腋寨，兼容聪铺、寫出優(yōu)美的代碼格式
6）針對服務(wù)器的優(yōu)化、擁抱 HTML5
