1.精靈圖和base64如何選擇？

　　精靈圖，是網(wǎng)頁(yè)處圖圖片的一種方式，它是把多張小圖整合到一張，利用background-position屬性定位某個(gè)圖片的位置，來達(dá)到在大圖片中引用某個(gè)小圖片的效果，當(dāng)頁(yè)面訪問時(shí)，可以減少向服務(wù)器的yg有求次數(shù)，提高頁(yè)面的加載速度。

　　base64，是網(wǎng)絡(luò)上最常見的用于傳輸8Bit字節(jié)代碼的編碼方式之一，將原本二進(jìn)制形式轉(zhuǎn)成以64個(gè)字符基本單位，所組成的一串字符串。base64的圖片會(huì)隨著html或者css一起下載到瀏覽器,減少了請(qǐng)求，避免跨域問題，但是低版本的IE瀏覽器不兼容，體積比原來的圖片大，不利于css的加載，所以如果是圖比較大，就用精靈圖合并為一張大圖，使用base64直接把圖片編碼成字符串寫入CSS文件。

　　2.列舉5種IE haslayout的屬性及其值

　　haslayout ：是Windows Internet Explorer渲染引擎的一個(gè)內(nèi)部組成部分。在Internet Explorer中，一個(gè)元素要么自己對(duì)自身的內(nèi)容進(jìn)行計(jì)算大小和組織，要么依賴于父元素來計(jì)算尺寸和組織內(nèi)容。為了調(diào)節(jié)這兩個(gè)不同的概念，渲染引擎采用 了 hasLayout 的屬性，屬性值可以為true或false。當(dāng)一個(gè)元素的 hasLayout 屬性值為true時(shí)，我們說這個(gè)元素有一個(gè)布局(layout)

　　```

　　display:inline-block

　　position:absoult

　　zoom:任何值除了normal

　　min-height:任意值

　　min-width:任意值

　　ie7的

　　* min一height: (任意值)

　　* max一height: (除 none 外任意值)

　　* min一width: (任意值)

　　* max一width: (除 none 外任意值)

　　* overflow: (除 visible 外任意值)

　　* overflow一x: (除 visible 外任意值)

　　* overflow一y: (除 visible 外任意值)

　　* position: fixed

　　```

　　3.瀏覽器標(biāo)準(zhǔn)模式和怪異模式之間的區(qū)別是什么？

　　- 標(biāo)準(zhǔn)模式：是瀏覽器按照W3C標(biāo)準(zhǔn)解析執(zhí)行代碼，這樣用規(guī)定的語(yǔ)法去渲染，就可以兼容各個(gè)瀏覽器，保證以正確的形式展示網(wǎng)頁(yè)。

　　- 怪異模式：是使用瀏覽器自己的方式解析執(zhí)行代碼，因?yàn)椴煌瑸g覽器解析執(zhí)行的方式不一樣，所以我們稱之為怪異模式。

　　- 標(biāo)準(zhǔn)模式和怪異模式常見的區(qū)別：

　　- 標(biāo)準(zhǔn)模式：總寬度=width+margin(左右)+padding(左右)+border(左右)

　　- 怪異模式：總寬度=width+margin(左右)(width直接包括了padding(左右)+border(左右) )

　　4.瀏覽器怎么解析html文件？

　　- 渲染引擎的基本工作流程

　　- 解析HTML構(gòu)建DOM樹

　　- 渲染樹構(gòu)建

　　- 渲染樹布局

　　- 繪制渲染樹

　　- 渲染引擎會(huì)解析HTML文檔并把標(biāo)簽轉(zhuǎn)換成內(nèi)容樹中的DOM節(jié)點(diǎn)。它會(huì)解析style元素和外部文件中的樣式數(shù)據(jù)。樣式數(shù)據(jù)和HTML中的顯示控制將共同用來創(chuàng)建另一棵樹——渲染樹。渲染引擎會(huì)嘗試盡快的把內(nèi)容顯示出來。它不會(huì)等到所有HTML都被解析完才創(chuàng)建并布局渲染樹。它會(huì)在處理后續(xù)內(nèi)容的同時(shí)把處理過的局部?jī)?nèi)容先展示出來。

　　5.流式布局rem vm/vh px em的區(qū)別

　　- rem

　　- rem是相對(duì)于根元素 html，這樣就意味著，我們只需要在根元素確定一個(gè)font-size字號(hào)，則可以來算出元素的寬高

　　- px

　　- px意為像素 , 是設(shè)備或者圖片最小的一個(gè)點(diǎn)，比如常常聽到的電腦像素是1920x1080的，表示的是水平方向是1920個(gè)像素點(diǎn)，垂直方向是1080個(gè)像素點(diǎn)。是我們網(wǎng)頁(yè)設(shè)計(jì)常用的單位，也是基本單位。通過px可以設(shè)置固定的布局或者元素大小，缺點(diǎn)是沒有彈性。

　　- em

　　- 參考物是父元素的font-size，具有繼承的特點(diǎn)。如果自身定義了font-size按自身的font-size來計(jì)算(瀏覽器默認(rèn)字體是16px)，整個(gè)頁(yè)面內(nèi)1em不是一個(gè)固定的值。

　　特點(diǎn)是1. em的值并不是固定的; 2. em會(huì)繼承父級(jí)元素的字體大小。

　　- vw/vh

　　- vw view width的簡(jiǎn)寫，是指可視窗口的寬度。假如可視區(qū)域?qū)挾仁?920px的話。那1vw = 1920px/100 = 19.2px

　　- vh view height的簡(jiǎn)寫，是指可視窗口的高度。假如可視區(qū)域?qū)挾仁?080px的話。那1vh = 1080px/100 = 10.8px

　　- vm

　　- 相對(duì)于視口的寬度或高度中較小的那個(gè)。最小的那個(gè)被均分為100單位的 vm

　　- 例如： 瀏覽器高度900px，寬度1200px，取最小的瀏覽器高度，1vm = 900px / 100 = 9px。

　更多關(guān)于前端培訓(xùn)的問題，歡迎咨詢千鋒教育在線名師。千鋒教育擁有多年IT培訓(xùn)服務(wù)經(jīng)驗(yàn)，采用全程面授高品質(zhì)、高體驗(yàn)培養(yǎng)模式，擁有國(guó)內(nèi)一體化教學(xué)管理及學(xué)員服務(wù)，助力更多學(xué)員實(shí)現(xiàn)高薪夢(mèng)想。