一個朋友面試的題目，百度了一下這個中軟高科貌似是一個培訓機構。。。以下答案是我本人的理解，僅供參考
HTML+CSS
1、你能解釋一下css的盒子模型嗎？
有兩種盒子模型：IE盒子模型，W3C盒子模型。
標准的CSS盒子模型包括：內容（content）、填充（padding）、邊框（border）、邊距（margin）。
2、XHTML和HTML的區別？
最主要的差別：XHTML元素必須被正確的嵌套，XHTML必須被關閉，標簽名必須用小寫，XHTML文檔必須擁有根元素。
詳細文章可以參考：HTML和XHTML的區別
3、行內元素有哪些？塊級元素有哪些？
1） 行內元素有：a b span img input select strong ...；
2） 塊級元素有：div header main footer section ul p h1 h2 ...；
4、CSS選擇符有哪些？哪些屬性可以繼承？優先級算法如何計算？內聯和 important哪個優先級高？
1） id選擇器（#）、類選擇器（.）、標簽選擇器（div）、兄弟元素選擇器（div + p）、子選擇器（ul>li）、后代選擇器（div a）、通配符選擇器（*）、屬性選擇器（input[type="number"]）、偽類選擇器（a:hover，p:nth-child）
2） 所有元素可繼承：visibility和cursor。
內聯元素可繼承：letter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction。
列表元素可繼承：list-style、list-style-type、list-style-position、list-style-image。
表格元素可繼承：border-collapse。
3） 內聯樣式表的權值最高 1000；
ID 選擇器的權值為 100；
Class 類選擇器的權值為 10；
HTML 標簽選擇器的權值為 1
4） important比內聯優先級高
5、前端頁面有哪三層構成，分別是什么，作用是什么？
1） 由結構層，表示層，行為層組成
2） 結構層：對網頁的內容作出描述；
表示層：負責如何顯示內容；
行為層：對網頁中的事件作出反應；
6、哪些瀏覽器支持HTML5，這些瀏覽器的內核分別是什么？
目前使用較為廣泛的瀏覽器有：IE，Google，Firefox，Safari和Opera；
內核分別是：IE（Trident），WebKit，Gecko，WebKit，Presto；
7、寫出5種以上IE6 BUG的解決辦法，哪些你認為解決起來是最麻煩的？
1） IE6在塊級元素設置左右浮動，設定的margin造成雙邊距bug
解決辦法：display: inline;
2） line-height，文本垂直居中差1px
解決辦法：padding-top代替line-height居中，或line-height加1或減1
3） img於塊元素中，底邊多出空白
解決辦法：父級設置overflow: hidden; 或 img { display: block; } 或 _margin: -5px;
4） li之間會有間距
解決辦法：float: left;
5） position下的left，bottom錯位
解決辦法：為父級(relative層)設置寬高或添加*zoom:1
都很麻煩。。。
8、描述CSS reset的作用和用途
reset的作用是讓各個瀏覽器的CSS樣式有一個統一的基准，理解為初始化css樣式
9、解釋CSS sprites，如何使用？
Sprite是圖片處理技術，俗稱圖片精靈。
1、將用到的背景圖片壓縮為zip格式的壓縮包
2、用Css圖片拼合生成器將其拼合成一張圖片，然后下載該圖片
3、拼合完成后會生成相應的Css規則，該文件定位了每個圖片的位置及圖片的寬度和高度
4、在Css樣式中定位背景圖片
10、你如何對網站的文件和資源進行優化？
1） 利用瀏覽器緩存js文件和css文件
2） 優化js，css代碼，避免重用。
3） 使用 css sprite合並圖片。
4） 文件合並，文件壓縮。減少http請求，減少體積。
5） 使用cdn托管資源
11、什么是語義化的HTML，HTML5新增的語義化標簽有哪些？
1） html語義化讓頁面的內容結構化，結構更加清晰，便於瀏覽器、搜索引擎解析。
使閱讀代碼的人對網站更容易分塊，便於閱讀維護和理解。
2） 比如：header，main，footer，canvas等
12、清楚浮動的幾種方式，各自的優缺點。
1） 父級元素定義高度：優點是簡單，代碼少，容易掌握，缺點是只適合高度固定的布局，一旦高度不一致時就會出現問題。
2） 結尾處添加空div標簽clear: both：優點是代碼少，瀏覽器支持好，不容易出現怪問題，缺點是如果頁面浮動布局多，就要增加很多空div，讓人感覺很不爽。
3） 父級元素設置overflow: hidden：優點是簡單，代碼少，瀏覽器支持好，缺點是不能和position配合使用，因為超出的尺寸的會被隱藏。
只介紹三種。。。
JS
1、JavaScript 的 typeof 返回哪些數據類型？
返回6中數據類型：undefined，string，Boolean，number，object，function。
2、split() join()的區別？數組方法pop() push() unshift() shift()。
1） split() 方法用於把一個字符串分割成字符串數組。
join() 方法用於把數組中的所有元素放入一個字符串。
區別：前者是將字符串切割成數組的形式，后者是將數組轉化為字符串。
2） shift() 方法用於把數組的第一個元素從其中刪除，並返回第一個元素的值
unshift() 方法可向數組的開頭添加一個或更多元素，並返回新的長度
pop() 方法用於刪除並返回數組的最后一個元素
push() 方法可向數組的末尾添加一個或多個元素，並返回新的長度
3、事件綁定和普通事件有什么區別？
普通添加事件的方法不支持添加多個事件，最下面的事件會覆蓋上面的，而事件綁定（addEventListener）方式添加事件可以添加多個
4、IE和標准下有哪些兼容性的寫法？
獲取鼠標當前的坐標：
IE下event.x，event.y；
標准下event.pageX，event.pageY；
獲取窗體的高度和寬度：
IE下document.body.offsetWidth和document.body.offsetHeight
標准下document.documentElement.clientWidth和document.documentElement.clientHeight
添加事件：
IE下element.attachEvent(”onclick”, func)；
標准下element.addEventListener(”click”, func, true)；
5、ajax 在請求的時候 get請求和 post請求的區別？
1）使用Get請求時,參數在URL中顯示,而使用Post方式,則不會顯示出來
2）使用Get請求發送數據量小,Post請求發送數據量大
3）Get請求安全性較低，Post安全性較高