1.你能描述一下漸進(jìn)增強(qiáng)和優(yōu)雅降級之間的不同嗎?
優(yōu)雅降級：Web站點(diǎn)在所有新式瀏覽器中都能正常工作有咨，如果用戶使用的是老式瀏覽器，則代碼會檢查以確認(rèn)它們是否能正常工作荆虱。由于IE獨(dú)特的盒模型布局問題会通，針對不同版本的IE的hack實(shí)踐過優(yōu)雅降級了,為那些無法支持功能的瀏覽器增加候選方案，使之在舊式瀏覽器上以某種形式降級體驗(yàn)卻不至于完全失效.
漸進(jìn)增強(qiáng)：從被所有瀏覽器支持的基本功能開始胰坟，逐步地添加那些只有新式瀏覽器才支持的功能,向頁面增加無害于基礎(chǔ)瀏覽器的額外樣式和功能的。當(dāng)瀏覽器支持時泞辐，它們會自動地呈現(xiàn)出來并發(fā)揮作用笔横。
2.線程與進(jìn)程的區(qū)別
一個程序至少有一個進(jìn)程，一個進(jìn)程至少有一個線程咐吼。線程的劃分尺度小于進(jìn)程吹缔，使得多線程程序的并發(fā)性高。
另外锯茄，進(jìn)程在執(zhí)行過程中擁有獨(dú)立的內(nèi)存單元厢塘，而多個線程共享內(nèi)存，從而極大地提高了程序的運(yùn)行效率肌幽。
線程在執(zhí)行過程中與進(jìn)程還是有區(qū)別的晚碾。每個獨(dú)立的線程有一個程序運(yùn)行的入口、順序執(zhí)行序列和程序的出口喂急。但是線程不能夠獨(dú)立執(zhí)行格嘁，必須依存在應(yīng)用程序中，由應(yīng)用程序提供多個線程執(zhí)行控制廊移。
從邏輯角度來看讥蔽，多線程的意義在于一個應(yīng)用程序中，有多個執(zhí)行部分可以同時執(zhí)行画机。但操作系統(tǒng)并沒有將多個線程看做多個獨(dú)立的應(yīng)用，來實(shí)現(xiàn)進(jìn)程的調(diào)度和管理以及資源分配新症。這就是進(jìn)程和線程的重要區(qū)別步氏。
3.說說你對語義化的理解？
1：去掉或樣式丟失的時候能讓頁面呈現(xiàn)清晰的結(jié)構(gòu)：html本身是沒有表現(xiàn)的徒爹，我們看到例如<h1>是粗體荚醒，字體大小2em芋类，加粗；<strong>是加粗的界阁，不要認(rèn)為這是html的表現(xiàn)侯繁，這些其實(shí)html默認(rèn)的css樣式在起作用，所以去掉或樣式丟失的時候能讓頁面呈現(xiàn)清晰的結(jié)構(gòu)不是語義化的HTML結(jié)構(gòu)的優(yōu)點(diǎn)泡躯，但是瀏覽器都有有默認(rèn)樣式贮竟，默認(rèn)樣式的目的也是為了更好的表達(dá)html的語義，可以說瀏覽器的默認(rèn)樣式和語義化的HTML結(jié)構(gòu)是不可分割的较剃。
2.屏幕閱讀器（如果訪客有視障）會完全根據(jù)你的標(biāo)記來“讀”你的網(wǎng)頁咕别。
3.PDA、手機(jī)等設(shè)備可能無法像普通電腦的瀏覽器一樣來渲染網(wǎng)頁（通常是因?yàn)檫@些設(shè)備對CSS的支持較弱）写穴。
4.有利于SEO：和搜索引擎建立良好溝通惰拱，有助于爬蟲抓取更多的有效信息：爬蟲依賴于標(biāo)簽來確定上下文和各個關(guān)鍵字的權(quán)重。
6.便于團(tuán)隊(duì)開發(fā)和維護(hù)啊送，語義化更具可讀性偿短，是下一步吧網(wǎng)頁的重要動向，遵循W3C標(biāo)準(zhǔn)的團(tuán)隊(duì)都遵循這個標(biāo)準(zhǔn)馋没，可以減少差異化昔逗。
4.你如何對網(wǎng)站的文件和資源進(jìn)行優(yōu)化？
期待的解決方案包括：文件合并文件最小化/文件壓縮使用CDN托管緩存的使用（多個域名來提供緩存）其他披泪。
5.為什么利用多個域名來提供網(wǎng)站資源會更有效纤子？
1.CDN緩存更方便
2.突破瀏覽器并發(fā)限制（一般每個域名建立的鏈接不超過6個）
3.Cookieless，節(jié)省帶寬款票，尤其是上行帶寬一般比下行要慢
4.對于UGC的內(nèi)容和主站隔離控硼，防止不必要的安全問題(上傳js竊取主站cookie之類的)。正是這個原因要求用戶內(nèi)容的域名必須不是自己主站的子域名艾少，而是一個完全獨(dú)立的第三方域名卡乾。
5.數(shù)據(jù)做了劃分，甚至切到了不同的物理集群缚够，通過子域名來分流比較省事幔妨。這個可能被用的不多。
PS:關(guān)于Cookie的問題谍椅，帶寬是次要的误堡，安全隔離才是主要的。關(guān)于多域名雏吭，也不是越多越好锁施，雖然服務(wù)器端可以做泛解釋，瀏覽器做dns解釋也是耗時間的，而且太多域名悉抵，如果要走h(yuǎn)ttps的話肩狂，還有要多買證書和部署的問題。
6.請說出三種減少頁面加載時間的方法姥饰。（加載時間指感知的時間或者實(shí)際加載時間）
1.優(yōu)化圖片
2.圖像格式的選擇（GIF：提供的顏色較少傻谁，可用在一些對顏色要求不高的地方）
3.優(yōu)化CSS（壓縮合并css，如margin-top,margin-left...)
4.網(wǎng)址后加斜杠（如www.campr.com/目錄列粪，會判斷這個“目錄是什么文件類型审磁，或者是目錄。）
5.標(biāo)明高度和寬度（如果瀏覽器沒有找到這兩個參數(shù)篱竭，它需要一邊下載圖片一邊計(jì)算大小力图，如果圖片很多，瀏覽器需要不斷地調(diào)整頁面掺逼。這不但影響速度吃媒，也影響瀏覽體驗(yàn)。當(dāng)瀏覽器知道了高度和寬度參數(shù)后吕喘，即使圖片暫時無法顯示赘那，頁面上也會騰出圖片的空位，然后繼續(xù)加載后面的內(nèi)容氯质。從而加載時間快了募舟，瀏覽體驗(yàn)也更好了。）
6.減少http請求（合并文件闻察，合并圖片）拱礁。
7.如果你參與到一個項(xiàng)目中，發(fā)現(xiàn)他們使用Tab來縮進(jìn)代碼辕漂，但是你喜歡空格呢灶，你會怎么做？
建議這個項(xiàng)目使用像EditorConfig(http://editorconfig.org/)之類的規(guī)范
為了保持一致性钉嘹，接受項(xiàng)目原有的風(fēng)格
直接使用VIM的retab命令
8.請寫一個簡單的幻燈效果頁面
如果不使用JS來完成鸯乃，可以加分。（如：純CSS實(shí)現(xiàn)的幻燈片效果）
9.你都使用哪些工具來測試代碼的性能跋涣？
Profiler,JSPerf（http://jsperf.com/nexttick-vs-setzerotimeout-vs-settimeout）,Dromaeo缨睡。
10.如果今年你打算熟練掌握一項(xiàng)新技術(shù)，那會是什么陈辱？
nodejs奖年，html5，css3沛贪，less等拾并。
11.請談一下你對網(wǎng)頁標(biāo)準(zhǔn)和標(biāo)準(zhǔn)制定機(jī)構(gòu)重要性的理解揍堰。
w3c存在的意義就是讓瀏覽器兼容性問題盡量小，首先是他們對瀏覽器開發(fā)者的約束嗅义，然后是對開發(fā)者的約束。
12.什么是FOUC（無樣式內(nèi)容閃爍）隐砸？你如何來避免FOUC之碗？
FOUC(Flash Of Unstyled Content)--文檔樣式閃爍
<style type="text/css"media="all">@import"../fouc.css";</style>而引用CSS文件的@import就是造成這個問題的罪魁禍?zhǔn)住E會先加載整個HTML文檔的DOM季希，然后再去導(dǎo)入外部的CSS文件褪那，因此，在頁面DOM加載完成到CSS導(dǎo)入完成中間會有一段時間頁面上的內(nèi)容是沒有樣式的式塌，這段時間的長短跟網(wǎng)速博敬，電腦速度都有關(guān)系。解決方法簡單的出奇峰尝，只要在<head>之間加入一個<link>或者<script>元素就可以了偏窝。
13.doctype（文檔類型）的作用是什么？你知道多少種文檔類型武学？
此標(biāo)簽可告知瀏覽器文檔使用哪種HTML或XHTML規(guī)范祭往。該標(biāo)簽可聲明三種DTD類型，分別表示嚴(yán)格版本火窒、過渡版本以及基于框架的HTML文檔硼补。
HTML 4.01規(guī)定了三種文檔類型：Strict、Transitional以及Frameset熏矿。
XHTML 1.0規(guī)定了三種XML文檔類型：Strict已骇、Transitional以及Frameset。
Standards（標(biāo)準(zhǔn)）模式（也就是嚴(yán)格呈現(xiàn)模式）用于呈現(xiàn)遵循最新標(biāo)準(zhǔn)的網(wǎng)頁票编，而Quirks（包容）模式（也就是松散呈現(xiàn)模式或者兼容模式）用于呈現(xiàn)為傳統(tǒng)瀏覽器而設(shè)計(jì)的網(wǎng)頁褪储。
14.瀏覽器標(biāo)準(zhǔn)模式和怪異模式之間的區(qū)別是什么？
W3C標(biāo)準(zhǔn)推出以后栏妖，瀏覽器都開始采納新標(biāo)準(zhǔn)乱豆，但存在一個問題就是如何保證舊的網(wǎng)頁還能繼續(xù)瀏覽，在標(biāo)準(zhǔn)出來以前吊趾，很多頁面都是根據(jù)舊的渲染方法編寫的宛裕，如果用的標(biāo)準(zhǔn)來渲染，將導(dǎo)致頁面顯示異常论泛。為保持瀏覽器渲染的兼容性揩尸，使以前的頁面能夠正常瀏覽，瀏覽器都保留了舊的渲染方法（如：微軟的IE）屁奏。這樣瀏覽器渲染上就產(chǎn)生了Quircks mode和Standars mode岩榆，兩種渲染方法共存在一個瀏覽器上。IE盒子模型和標(biāo)準(zhǔn)W3C盒子模型：ie的width包括：padding\border。標(biāo)準(zhǔn)的width不包括：padding\border
在js中如何判斷當(dāng)前瀏覽器正在以何種方式解析勇边？
document對象有個屬性compatMode,它有兩個值：BackCompat對應(yīng)quirks mode犹撒，CSS1Compat對應(yīng)strict mode。
15.使用XHTML的局限有哪些粒褒？
XHTML 與HTML的區(qū)別為：
XHTML 元素必須被正確地嵌套识颊。
XHTML 元素必須被關(guān)閉。
標(biāo)簽名必須用小寫字母奕坟。
XHTML 文檔必須擁有根元素祥款。
局限：
所有的 XHTML 元素都必須被正確地嵌套，XHTML 必須擁有良好的結(jié)構(gòu)月杉，所有的標(biāo)簽必須小寫刃跛，并且所有的 XHTML 元素必須被關(guān)閉。所有的 XHTML 文檔必須擁有 DOCTYPE 聲明苛萎，并且 html桨昙、head、title 和 body 元素必須存在首懈。雖然代碼更加的優(yōu)雅绊率，但缺少容錯性，不利于快速開發(fā)究履。
16.如果網(wǎng)頁內(nèi)容需要支持多語言滤否，你會怎么做？
下面這些問題需要考慮：
應(yīng)用字符集的選擇最仑，選擇UTF-8編碼
語言書寫習(xí)慣&導(dǎo)航結(jié)構(gòu)
數(shù)據(jù)庫驅(qū)動型網(wǎng)站
17.data-屬性的作用是什么藐俺？
data-* 屬性用于存儲頁面或應(yīng)用程序的私有自定義數(shù)據(jù)。data-* 屬性賦予我們在所有 HTML 元素上嵌入自定義 data 屬性的能力泥彤。存儲的（自定義）數(shù)據(jù)能夠被頁面的 JavaScript 中利用欲芹，以創(chuàng)建更好的用戶體驗(yàn)（不進(jìn)行 Ajax 調(diào)用或服務(wù)器端數(shù)據(jù)庫查詢）。
data-* 屬性包括兩部分：
屬性名不應(yīng)該包含任何大寫字母吟吝，并且在前綴 "data-" 之后必須有至少一個字符
屬性值可以是任意字符串
18.如果把HTML5看作做一個開放平臺菱父，那它的構(gòu)建模塊有哪些？
<nav>,<header>,<section>,<footer>等剑逃。
19.請描述一下cookies浙宜，sessionStorage和localStorage的區(qū)別？
sessionStorage和localStorage是HTML5 Web Storage API提供的蛹磺，可以方便的在web請求之間保存數(shù)據(jù)粟瞬。有了本地?cái)?shù)據(jù)，就可以避免數(shù)據(jù)在瀏覽器和服務(wù)器間不必要地來回傳遞萤捆。sessionStorage裙品、localStorage俗批、cookie都是在瀏覽器端存儲的數(shù)據(jù)，其中sessionStorage的概念很特別市怎，引入了一個“瀏覽器窗口”的概念岁忘。sessionStorage是在同源的同窗口（或tab）中，始終存在的數(shù)據(jù)焰轻。也就是說只要這個瀏覽器窗口沒有關(guān)閉臭觉，即使刷新頁面或進(jìn)入同源另一頁面，數(shù)據(jù)仍然存在辱志。關(guān)閉窗口后，sessionStorage即被銷毀狞膘。同時“獨(dú)立”打開的不同窗口揩懒，即使是同一頁面，sessionStorage對象也是不同的cookies會發(fā)送到服務(wù)器端挽封。其余兩個不會已球。Microsoft指出InternetExplorer8增加cookie限制為每個域名50個，但I(xiàn)E7似乎也允許每個域名50個cookie辅愿。
Firefox每個域名cookie限制為50個。
Opera每個域名cookie限制為30個。
Firefox和Safari允許cookie多達(dá)4097個字節(jié)鹃唯，包括名（name）畴椰、值（value）和等號。
Opera允許cookie多達(dá)4096個字節(jié)癞埠，包括：名（name）状原、值（value）和等號。
InternetExplorer允許cookie多達(dá)4095個字節(jié)苗踪，包括：名（name）颠区、值（value）和等號。
20.描述下“reset”CSS文件的作用和使用它的好處通铲。
因?yàn)闉g覽器的品種很多毕莱，每個瀏覽器的默認(rèn)樣式也是不同的，所以定義一個css reset可以使各瀏覽器的默認(rèn)樣式統(tǒng)一颅夺。
21.解釋下浮動和它的工作原理朋截。
關(guān)于浮動我們需要了解，浮動的框可以向左或向右移動碗啄，直到它的外邊緣碰到包含框或另一個浮動框的邊框?yàn)橹怪屎汀Ｒ胧乖馗樱仨殲樵卦O(shè)置一個寬度（width）稚字。雖然浮動元素不是文檔流之中饲宿，但是它浮動后所處的位置依然是在浮動之前的水平方向上厦酬。由于浮動框不在文檔的普通流中，所以文檔的普通流中的塊框表現(xiàn)得就像浮動框不存在一樣瘫想，下面的元素填補(bǔ)原來的位置仗阅。有些元素會在浮動元素的下方，但是這些元素的內(nèi)容并不一定會被浮動的元素所遮蓋国夜，對內(nèi)聯(lián)元素進(jìn)行定位時减噪，這些元素會考慮浮動元素的邊界，會圍繞著浮動元素放置车吹。也可以把浮動元素想象成是被塊元素忽略的元素筹裕，而內(nèi)聯(lián)元素會關(guān)注浮動元素的。
22.列舉不同的清除浮動的技巧窄驹，并指出它們各自適用的使用場景朝卒。
1.使用空標(biāo)簽清除浮動。這種方法是在所有浮動標(biāo)簽后面添加一個空標(biāo)簽定義css clear:both.弊端就是增加了無意義標(biāo)簽乐埠。
2.使用overflow抗斤。給包含浮動元素的父標(biāo)簽添加css屬性overflow:auto;zoom:1;zoom:1用于兼容IE6。
3.使用after偽對象清除浮動丈咐。該方法只適用于非IE瀏覽器瑞眼。具體寫法可參照以下示例。使用中需注意以下幾點(diǎn)棵逊。一伤疙、該方法中必須為需要清除浮動元素的偽對象中設(shè)置height:0，否則該元素會比實(shí)際高出若干像素歹河；二掩浙、content屬性是必須的，但其值可以為空秸歧，content屬性的值設(shè)為”.”厨姚，空亦是可以的。
4.浮動外部元素
此三種方法各有利弊键菱，使用時應(yīng)擇優(yōu)選擇谬墙，比較之下第二種方法更為可取。
23.解釋下CSS sprites经备，以及你要如何在頁面或網(wǎng)站中使用它拭抬。
CSS Sprites其實(shí)就是把網(wǎng)頁中一些背景圖片整合到一張圖片文件中，再利用CSS的“background-image”侵蒙，“background-repeat”造虎，“background-position”的組合進(jìn)行背景定位，background-position可以用數(shù)字能精確的定位出背景圖片的位置纷闺。
24.你最喜歡的圖片替換方法是什么算凿，你如何選擇使用份蝴。
1 <h2><span圖片丟這里></span>Hello World</h2>
把span背景設(shè)成文字內(nèi)容，這樣又可以保證seo氓轰，也有圖片的效果在上面婚夫。一般都是：alt，title署鸡，onerror案糙。
25.討論CSS hacks，條件引用或者其他靴庆。
各個瀏覽器都認(rèn)識时捌，這里給firefox用；
background-color:red\9;\9所有的ie瀏覽器可識別炉抒；
background-color:yellow\0;\0是留給ie8的+background-color:pink;+ie7定了匣椰；
background-color:orange;專門留給神奇的ie6；:root#test{background-color:purple\9;}:root是給ie9的端礼，
@media all and(min-width:0px){#test{background-color:black\0;}}這個是老是跟ie搶著認(rèn)\0的神奇的opera，必須加個\0,不然firefox入录，chrome蛤奥，safari也都認(rèn)識。
@media screen and(-webkit-min-device-pixel-ratio:0){#test{background-color:gray;}}最后這個是瀏覽器新貴chrome和safari的僚稿。
27.如何視覺隱藏網(wǎng)頁內(nèi)容凡桥，只讓它們在屏幕閱讀器中可用？
display:none;的缺陷搜索引擎可能認(rèn)為被隱藏的文字屬于垃圾信息而被忽略屏幕閱讀器（是為視覺上有障礙的人設(shè)計(jì)的讀取屏幕內(nèi)容的程序）會忽略被隱藏的文字蚀同。
visibility:hidden;的缺陷這個大家應(yīng)該比較熟悉就是隱藏的內(nèi)容會占據(jù)他所應(yīng)該占據(jù)物理空間3.overflow:hidden;一個比較合理的方法.texthidden{display:block;/統(tǒng)一轉(zhuǎn)化為塊級元素/overflow:hidden;width:0;height:0;}就像上面的一段CSS所展示的方法缅刽，將寬度和高度設(shè)定為0，然后超過部分隱藏蠢络，就會彌補(bǔ)上述一衰猛、二方法中的缺陷，也達(dá)到了隱藏內(nèi)容的目的刹孔。
28.你用過柵格系統(tǒng)嗎啡省？如果使用過，你最喜歡哪種髓霞？
比如：Bootstrap卦睹，流式柵格系統(tǒng)，http://960.gs/方库，柵格系統(tǒng)延續(xù)美學(xué)结序。
29.你用過媒體查詢，或針對移動端的布局/CSS嗎纵潦？
媒體查詢徐鹤，就是響應(yīng)式布局垃环。通過不同的媒介類型和條件定義樣式表規(guī)則。媒介查詢讓CSS可以更精確作用于不同的媒介類型和同一媒介的不同條件凳干。
語法結(jié)構(gòu)及用法：@media 設(shè)備名 only （選取條件） not （選取條件） and（設(shè)備選取條件）晴裹，設(shè)備二{sRules}。
示例如下：
/* 當(dāng)瀏覽器的可視區(qū)域小于980px */
@media screen and （max-width： 980px） {
wrap {width： 90%; margin:0 auto;}
content {width： 60%;padding： 5%;}
sidebar {width： 30%;}
footer {padding： 8% 5%;margin-bottom： 10px;}
}
/* 當(dāng)瀏覽器的可視區(qū)域小于650px */
@media screen and （max-width： 650px） {
header {height： auto;}
searchform {position： absolute;top： 5px;right： 0;}
content {width： auto; float： none; margin： 20px 0;}
sidebar {width： 100%; float： none; margin： 0;}
}
30.你熟悉SVG樣式的書寫嗎救赐？
SVG 意為可縮放矢量圖形（Scalable Vector Graphics）涧团。
什么是SVG？
SVG 指可伸縮矢量圖形 (Scalable Vector Graphics)
SVG 用來定義用于網(wǎng)絡(luò)的基于矢量的圖形
SVG 使用 XML 格式定義圖形
SVG 圖像在放大或改變尺寸的情況下其圖形質(zhì)量不會有所損失
SVG 是萬維網(wǎng)聯(lián)盟的標(biāo)準(zhǔn)
SVG 與諸如 DOM 和 XSL 之類的 W3C 標(biāo)準(zhǔn)是一個整體
書寫示例如下：
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" version="1.1" xmlns="http://www.w3.org/2000/svg">
<circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red"/>
</svg>
31.如何優(yōu)化網(wǎng)頁的打印樣式经磅？
<link rel = "stylesheet" type = "text/css" media = "screen" href = "xxx.css"/>
其中media指定的屬性就是設(shè)備泌绣，顯示器上就是screen，打印機(jī)則是print预厌，電視是tv阿迈，投影儀是projection。打印樣式示例如下：
<link rel = "stylesheet" type = "text/css" media = "print" href = "yyy.css"/>
但打印樣式表也應(yīng)注意以下事項(xiàng)：
打印樣式表中最好不要用背景圖片轧叽，因?yàn)榇蛴C(jī)不能打印CSS中的背景苗沧。如要顯示圖片，請使用html插入到頁面中炭晒。
最好不要使用像素作為單位待逞，因?yàn)榇蛴邮奖硪蛴〕鰜淼臅菍?shí)物，所以建議使用pt和cm网严。
隱藏掉不必要的內(nèi)容识樱。（@print div{display:none;}）
打印樣式表中最好少用浮動屬性，因?yàn)樗鼈儠д鹗Ｈ绻胍来蛴邮奖淼男Ч绾瘟梗苯釉跒g覽器上選擇打印預(yù)覽就可以了。
32.在書寫高效CSS時會有哪些問題需要考慮垢村？
1.樣式是：從右向左的解析一個選擇器割疾；
2.ID最快，Universal最慢有四種類型的key selector肝断，解析速度由快到慢依次是：ID杈曲、class、tag和universal 胸懈；
3.不要tag-qualify（永遠(yuǎn)不要這樣做ul#main-navigation{}ID已經(jīng)是唯一的担扑，不需要Tag來標(biāo)識，這樣做會讓選擇器變慢趣钱。）涌献；
4.后代選擇器最糟糕（換句話說，下面這個選擇器是很低效的：html body ul li a{}）首有；
5.想清楚你為什么這樣寫燕垃；
6.CSS3的效率問題（CSS3選擇器（比如:nth-child）能夠漂亮的定位我們想要的元素枢劝，又能保證我們的CSS整潔易讀。但是這些神奇的選擇器會浪費(fèi)很多的瀏覽器資源卜壕。）您旁；
7.我們知道#ID速度是最快的，那么我們都用ID轴捎，是不是很快鹤盒。但是我們不應(yīng)該為了效率而犧牲可讀性和可維護(hù)性。
33.使用CSS預(yù)處理器的優(yōu)缺點(diǎn)有哪些侦副？
LESS&SassLESS是受Sass啟發(fā)而開發(fā)的工具侦锯，它列出了如下開發(fā)的理由：
“為什么要開發(fā)一個Sass的替代品呢？原因很簡單：首先是語法秦驯。Sass的一個關(guān)鍵特性是縮進(jìn)式的語法尺碰，這種語法可以產(chǎn)生柱式外觀的代碼。但是你需要花費(fèi)時間學(xué)習(xí)一門新的語法以及重新構(gòu)建你現(xiàn)在的樣式表译隘。LESS給CSS帶來了很多特性亲桥，使得LESS能夠和CSS無縫地緊密結(jié)合在一起。因此固耘，你可以平滑地由CSS遷移到LESS两曼，如果你只是對使用變量或者操作感興趣的話，你不需要學(xué)習(xí)一整門全新的語言玻驻。”
StylusStylus相對前兩者較新偿枕，可以看官方文檔介紹的功能璧瞬。
1.來自NodeJS社區(qū)，所以和NodeJS走得很近渐夸，與JavaScript聯(lián)系非常緊密嗤锉。還有專門JavaScript API：http://learnboost.github.io/stylus/docs/js.html；
2.支持Ruby之類等等框架墓塌；
3.更多更強(qiáng)大的支持和功能總結(jié)：Sass看起來在提供的特性上占有優(yōu)勢瘟忱，但是LESS能夠讓開發(fā)者平滑地從現(xiàn)存CSS文件過渡到LESS，而不需要像Sass那樣需要將CSS文件轉(zhuǎn)換成Sass格式苫幢。Stylus功能上更為強(qiáng)壯访诱，和js聯(lián)系更加緊密。
34.如果設(shè)計(jì)中使用了非標(biāo)準(zhǔn)的字體韩肝，你該如何去實(shí)現(xiàn)触菜？
所謂的標(biāo)準(zhǔn)字體是多數(shù)機(jī)器上都會有的，或者即使沒有也可以由默認(rèn)字體替代的字體哀峻。
方法：
用圖片代替
web fonts在線字庫涡相，如Google Webfonts哲泊，Typekit等等；http://www.chinaz.com/free/2012/0815/269267.shtml催蝗；
@font-face切威，Webfonts(字體服務(wù)例如：Google Webfonts，Typekit等等丙号。)
35.解釋下瀏覽器是如何判斷元素是否匹配某個CSS選擇器先朦？
從后往前判斷。瀏覽器先產(chǎn)生一個元素集合槽袄，這個集合往往由最后一個部分的索引產(chǎn)生（如果沒有索引就是所有元素的集合）烙无。然后向上匹配，如果不符合上一個部分遍尺，就把元素從集合中刪除截酷，直到真?zhèn)€選擇器都匹配完，還在集合中的元素就匹配這個選擇器了乾戏。舉個例子迂苛，有選擇器：
body.ready#wrapper>.lol233
先把所有class中有l(wèi)ol233的元素拿出來組成一個集合，然后上一層鼓择，對每一個集合中的元素三幻，如果元素的parent id不為#wrapper則把元素從集合中刪去。再向上呐能，從這個元素的父元素開始向上找念搬，沒有找到一個tagName為body且class中有ready的元素，就把原來的元素從集合中刪去摆出。至此這個選擇器匹配結(jié)束朗徊，所有還在集合中的元素滿足。大體就是這樣偎漫，不過瀏覽器還會有一些奇怪的優(yōu)化爷恳。為什么從后往前匹配因?yàn)樾屎臀臋n流的解析方向。效率不必說象踊，找元素的父親和之前的兄弟比遍歷所喲兒子快而且方便温亲。關(guān)于文檔流的解析方向，是因?yàn)楝F(xiàn)在的CSS杯矩，一個元素只要確定了這個元素在文檔流之前出現(xiàn)過的所有元素栈虚，就能確定他的匹配情況。應(yīng)用在即使html沒有載入完成史隆，瀏覽器也能根據(jù)已經(jīng)載入的這一部分信息完全確定出現(xiàn)過的元素的屬性节芥。為什么是用集合主要也還是效率。基于CSS Rule數(shù)量遠(yuǎn)遠(yuǎn)小于元素?cái)?shù)量的假設(shè)和索引的運(yùn)用头镊，遍歷每一條CSS Rule通過集合篩選蚣驼，比遍歷每一個元素再遍歷每一條Rule匹配要快得多。
