- 描述css reset的作用和樣式：
Reset 重置瀏覽器的 css 默認屬性 ，覽器的品種不同，樣式不同，然後重置，讓他們統一。
- 解釋 css sprites，如何使用？
把多張小圖片整合到一張大的png圖上，再利用background-size ,background-position等進行背景定位使用，這樣做可以減少http請求數量，增強性能。
- 能否簡述一下如何使一套設計方案，適應不同的分辨率，有哪些方法可以實現？
流式佈局：
使用非固定像素來定義網頁的內容，也就是百分比佈局，通過盒子的寬度設置成百分比來根據屏幕的寬度進行伸縮，不受固定像素的限制，內容向兩側填充。這樣的佈局是移動web開發使用的常用佈局方式。這樣的佈局可以適配移動端不同的分辨率設備。
響應式開發：
就是一個網站能夠兼容多個終端。針對新建站的一些網站，現在要求適配移動端，所以就一套頁面兼容各種終端，靈活。但是開發效率低，代碼相對複雜，加載慢。
移動web開發+pc開發：
一般是在已經有pc端的網站的情況下，開發移動端，只需要單獨開發移動端。開發效率高，代碼簡潔，加載快，pad上面體驗相對較差。
- 描述下漸進增強和優雅降級？
漸進增強(progressive enhancement)：針對低版本瀏覽器進行構建頁面，保證最基本的功能，然後再針對高級瀏覽器進行效果，交互等改進和追加功能達到更好的用戶體驗。
優雅降級(graceful degradation)：一開始就構建完整的功能，然後再針對低版本瀏覽器進行兼容。
- css選擇器有哪些，及其優先級是如何
選擇器越特殊，它的優先級越高。也就是選擇器指向的越準確，它的優先級就越高。！important >行內樣式> ID > 類 > 標籤 | 僞類 | 屬性選擇 > 僞對象 > 繼承 > 通配符。
-
用 CSS 定義 p 標籤，要求實現以下效果：字體顏色在 IE6 下爲黑色(#000000)；IE7 下爲紅色(#ff0000)；而其他瀏覽器下爲綠色(#00ff00)
答：p{ color：green；
*color：blue；
_color：black； } -
HTML 與 XHTML——二者有什麼區別?
HTML 是一種基本的 WEB 網頁設計語言，XHTML 是一個基於 XML 的置標語言 最主要的不同：
XHTML 元素必須被正確地嵌套。
XHTML 元素必須被關閉。
XHTML標籤名必須用小寫字母。
XHTML 文檔必須擁有根元素。 -
CSS hack是什麼？ie6,7,8 的 hack 分別是什麼？
css hack: 針對不同的瀏覽器寫不同的 CSS code 的過程，就是 CSS hack。
background-color:yellow; /ie8/ +background-color:pink; /ie7/ _background-color:orange; /ie6/ -
display：inline-block 什麼時候會顯示間隙？
inline-block 水平呈現的元素間，換行顯示或空格分隔的情況下會有間距。
解決辦法：父元素{font-size：0；-webkit-text-size-adjust：none；} -
overflow有哪些屬性：
默認值visible:內容不會被修剪。
hidden:內容會被修剪，並且其餘內容是不可見的。
scroll:內容會被修剪，剩餘內容以滾動條形式呈現。
auto: 如果內容被修剪，剩餘內容以滾動條形式呈現。 -
css去掉iphone,ipad默認按鈕樣式：
input[type=“button”], input[type=“submit”], input[type=“reset”] {
-webkit-appearance: none; }
textarea { -webkit-appearance: none;} -
用 div+css 網站佈局的好處:
首先是表現和內容相分離，然後能提高搜索引擎對網頁的索引效率， 用只包含結構化內容的 HTML 代替嵌套的標籤，搜索引擎將更有效地搜索到你的網頁內容，並可能給你一個較高的評價。提高頁面瀏覽速度，對於同一個頁面視覺效果，採用 CSS+DIV 重構的頁面容量要比 TABLE 編碼的頁面文件容量小得多，前者一般只有後者的1/2大小。然後易於維護和改版，只要簡單的修改幾個 CSS 文件就可以重新設計整個網站的頁面 -
用table佈局有什麼影響:
table之所以存在於html中,只是爲了顯示錶格狀的數據。把格式數據混入內容中，這使文件的大小無謂地變大，而且用戶訪問每個頁面時必須下載一次這樣的格式信息。而且不利於seo優化。 -
console 有哪些常用方法?
console.log/console.info/console.error/console.warning/console.time/console.timeEnd/console.trace/console.table -
爲什麼利用多個域名來存儲網站資源會更有效？
首先CDN 緩存更方便 ②突破瀏覽器併發限制③節約 cookie 帶寬④節約主域名的連接數，優化頁面響應速度 ⑤防止不必要的安全問題 -
網頁的重繪於重排以及重構：
重繪是一個元素外觀的改變所觸發的瀏覽器行爲，例如改變 visibility、outline、背景色等屬性。 瀏覽器會根據元素的新屬性重新繪製，使元素呈現新的外觀。重繪不會帶來重新佈局，並不一定 伴隨重排。
重排是更明顯的一種改變，可以理解爲渲染樹需要重新計算。下面是常見的觸發重排的操作： 1.DOM 元素的幾何屬性變化 2. DOM 樹的結構變化 3. 獲取某些屬性 4. 此外，改變元素的一 些樣式，調整瀏覽器窗口大小等等也都將觸發重排。
重構分爲頁面重構和網站重構：
頁面重構：編寫 CSS、讓頁面結構更合理化，提升用戶體驗，實現良好的頁面效果和提升性能。
網站重構：在不改變外部行爲的前提下，簡化結構、添加可讀性，而在網站前端保持一致的行 爲。也就是說是在不改變 UI 的情況下，對網站進行優化，在擴展的同時保持一致的 UI。
對於傳統的網站來說重構通常是： 表格(table)佈局改爲 DIV+CSS 使網站前端兼容於現代瀏覽器(針對於不合規範的 CSS、如對 IE6 有效的) 對於移動平臺的優化 針對於 SEO 進行優化。
深層次的網站重構應該考慮的方面： 減少代碼間的耦合 讓代碼保持彈性 嚴格按規範編寫代碼 設計可擴展的 API 代替舊有的框架、語言(如 VB) 增強用戶體驗 優化響應速度 速度的優化重構： 壓縮 JS、CSS、image 等前端資源(通常是由服務器來解決) 程序的性能優化(如數據讀寫) 採用 CDN 來加速資源加載 對於 JS DOM 的優化 HTTP 服務器的文件緩存 -
以前端角度談談seo優化：
瞭解搜索引擎如何抓取網頁和如何索引網頁 你需要知道一些搜索引擎的基本工作原理，各個搜索引擎之間的區別，搜索機器人（SE robot 或叫 web crawler）如何進行工作，搜索引擎如何對搜索結果進行排序等等。 Meta 標籤優化 主要包括主題（Title)，網站描述(Description)，和關鍵詞（Keywords）。還有一些其它的隱藏文 字比如 Author（作者），Category（目錄），Language（編碼語種）等。 如何選取關鍵詞並在網頁中放置關鍵詞 搜索就得用關鍵詞。關鍵詞分析和選擇是 SEO 最重要的工作之一。首先要給網站確定主關鍵 詞（一般在5個上下），然後針對這些關鍵詞進行優化，包括關鍵詞密度（Density），相關度（Relavancy）， 突出性（Prominency）等等。 瞭解主要的搜索引擎 雖然搜索引擎有很多，但是對網站流量起決定作用的就那麼幾個。比如英文的主要有 Google， Yahoo，Bing 等；中文的有百度，搜狗，有道等。不同的搜索引擎對頁面的抓取和索引、排序的規 則都不一樣。還要了解各搜索門戶和搜索引擎之間的關係，比如 AOL 網頁搜索用的是 Google 的搜 索技術，MSN 用的是 Bing 的技術。 主要的互聯網目錄 Open Directory 自身不是搜索引擎，而是一個大型的網站目錄，他和搜索引擎的主要區別是網 站內容的收集方式不同。目錄是人工編輯的，主要收錄網站主頁；搜索引擎是自動收集的，除了 主頁外還抓取大量的內容頁面。 按點擊付費的搜索引擎 搜索引擎也需要生存，隨着互聯網商務的越來越成熟，收費的搜索引擎也開始大行其道。最典型的有 Overture 和百度，當然也包括 Google 的廣告項目 Google Adwords。越來越多的人通過搜 索引擎的點擊廣告來定位商業網站，這裏面也大有優化和排名的學問，你得學會用最少的廣告投入獲得最多的點擊。 搜索引擎登錄 網站做完了以後，別躺在那裏等着客人從天而降。要讓別人找到你，最簡單的辦法就是將網 站提交（submit）到搜索引擎。如果你的是商業網站，主要的搜索引擎和目錄都會要求你付費來獲得收錄（比如 Yahoo 要 299 美元），但是好消息是（至少到目前爲止）最大的搜索引擎 Google 目前還是免費，而且它主宰着 60％以上的搜索市場。 鏈接交換和鏈接廣泛度（Link Popularity） 網頁內容都是以超文本（Hypertext）的方式來互相鏈接的，網站之間也是如此。除了搜索引 擎以外，人們也每天通過不同網站之間的鏈接來 Surfing（“衝浪”）。其它網站到你的網站的鏈接越多，你也就會獲得更多的訪問量。更重要的是，你的網站的外部鏈接數越多，會被搜索引擎認爲它的重要性越大，從而給你更高的排名。合理的標籤使用。 -
rgba()和 opacity 的透明效果有什麼不同？
rgba()和 opacity 都能實現透明效果，但最大的不同是 opacity 作用於元素，以及元素內的所有內容的透明度， 而 rgba()只作用於元素的顏色或其背景色。（設置 rgba 透明的元素的子元素不會繼承透明效果！） -
Sass、LESS 是什麼？大家爲什麼要使用他們？
CSS 預處理器。他是 CSS 上的一種抽象層。他們是一種特殊的語法/語言編譯成 CSS。 例如 Less 是一種動態樣式語言. 將 CSS 賦予了動態語言的特性，如變量，繼承，運算， 函數. LESS 既可以在客戶端上運行 (支持 IE 6+, Webkit, Firefox)，也可一在服務端運行 (藉助 Node.js)。 爲什麼要使用它們？ 結構清晰，便於擴展。 可以方便地屏蔽瀏覽器私有語法差異。這個不用多說，封裝對瀏覽器語法差異的重複處理， 減少無意義的機械勞動。 可以輕鬆實現多重繼承。 完全兼容 CSS 代碼，可以方便地應用到老項目中。LESS 只是在 CSS 語法上做了擴展，所以老的 CSS 代碼也可以與 LESS 代碼一同編譯。 -
什麼是空元素？
單標籤，中間沒有內容的元素，如img input br等
(個人筆記供自己查閱)