最近剛好在看前端的面試，把看到的內容總結一下，方便大家一起學習。
1、簡單說一下對HTML5+CSS3的了解。
?????HTML5和CSS3不僅是兩項新的Web技術標準，而且代表了下一代HTML和CSS技術。其未來的發展前景已經可以預見，那就是HTML5必將被越來越多的Web開發人員所使用。各大瀏覽器廠家已經積極更新自己的產品，以更好地支持HTML5.它的優勢主要有以下幾點：
????1）更多的描述性標簽：HTML5引入非常多的描述性標簽。
????2）良好的媒體支持：對于先前以插件的方式播放音頻、視頻帶來的麻煩，HTML5有了解決方案，audio和video標簽能夠方便地實現應變。
????3）更強大的Web應用：HTML5提供了令人稱奇的功能，在某些情況下，甚至可以放棄使用第三方的技術。
????4）跨文檔信息通訊：Web瀏覽器會組織不同域間的腳本交互或影響，但是對于可信任的腳本或者就是麻煩。HTML5引入了一套安全且易于實現的應對方案。
????5）Web Sockets：HTML5提供了對Web Sockets的支持。
????6）客戶端存儲：HTML5的Web Storage和Web SQL Database API，可以在瀏覽器中構建Web應用的客戶端持久化數據。
????7）更加精美的界面：HTML5+CSS3組合渲染出來的界面效果更加精美。
????8）更強大的表單：HTML5提供了功能更加強大的表單界面控件，使用方便。
????9）提升可訪問性：內容更加清晰，使用戶的操作更加簡單方便，提升用戶體驗。
????10）先進的選擇器：CSS3選擇器可以方便的識別出表格的奇偶行，復選框等，代碼標記更少。
????11）視覺效果：具有精美的界面，有陰影、漸變、圓角、旋轉等視覺效果。
????CSS3是CSS技術的升級版本，CSS3語言開發是朝著模塊化發展的。作為一個模塊，以前的規范太龐大，而且比較復雜，所以把它分解為一些小的模塊，使更多的模塊被加進來。這些模塊包括：盒子模型、列表模塊、超鏈接方式、語言模塊、背景和邊框、文字特效、多欄布局等。
2、如果把HTML5看成一個開放平臺，那它的構建模塊有哪些。
?????如果把HTML5看成一個開放平臺，它構建的模塊至少包括以下幾個：<nav>、<header>、<section>、<footer>。
????<nav>標簽用來將具有導航性質的鏈接劃分在一起，使代碼結構在語義化方面更加準確。
????<header>標簽用來定義文檔的頁眉。
????<section>標簽用來描述文檔的結構。
????<footer>標簽用來定義頁腳。在典型情況下，該元素會包含作者的姓名，文檔的創作日期以及聯系信息。
3、CSS3有哪些新內容，請至少說出5個。
????1）CSS3圓角表格，對應屬性：border-radius。
????2）以往對網頁上的文字加特效只能用filter屬性，但是在CSS3中專門制定了一個加文字特效的屬性，而且不止加陰影這種效果。
對應屬性：font-effect。
????3）豐富了對鏈接下劃線的樣式，以往的下劃線都是直線，這次可不一樣了，有波浪線、點線、虛線等等，更可對下劃線的顏色和
位置進行任意改變，哈哈~~下劃線的世界從此不再單一。（還有對應頂線和中橫線的樣式，效果與下劃線類似）對應屬性：text-
underline-style，text-underline-color，text-underline-mode，text-underline-position。
????4）我們在做筆記時經常要在文字下點幾個點或打個圈什么的，以示重點，CSS3也開始加入了這項功能，這應該在某些特定網頁
上很有用。對應屬性：font-emphasize-style和font-emphasize-position。
????5）Font-face可以用來加載字體樣式，而且它還能夠加載服務器端的字體文件，顯示客戶端沒有安裝的字體。
4、HTML5有哪些新內容，請至少說出5個。
????1）HTML5已經確定引入canvas標簽，通過canvas，用戶可以動態生成各種圖形圖像，圖標以及動畫。canvas標簽還能夠配合
JavaScript利用鍵盤來控制圖形圖像。
????2）在HTML5中包含Web Forms 2.0，用來描繪如何進行頁面表格操作。其中最大的特點就是“表格確認”。當前，開發者通常
使用JavaScript（客戶端）和PHP（服務端）代碼來確認輸入的內容。
????3）HTML5為新元素和現有的元素提供更多的API，旨在改進頁面程序開發和增加HTML4所缺乏的特性。比如，一個視頻和音頻
方面的API將與<audio>和<video>元素一起使用，它將提供視頻和音頻的回放功能，而無須依賴第三方程序，比如flash。
????4）語意化更好的內容元素，比如 article、footer、header、nav、section。
????5）新的表單控件，比如 calendar、date、time、email、url、search。
5、HTML5新增的語義化標簽有哪些。
????HTML5新增的語義化標簽有很多，比如：
????1）<section></section>用于對網站或應用程序中頁面上的內容進行分塊。通常由內容及其標題組成。
????2）<article></article>代表文檔、頁面或應用程序中獨立的、完整的、可以獨自被外部引用的內容。當我們描述一件具體的事
物的時候，通常使用article來代替section。如一個帖子，一段用戶評論等。
????3）<aside></aside>表示當前頁面或者文章的附屬信息部分。如與當前頁面或主要內容相關的引用、側邊欄、廣告、nav元素組等。
????4）<nav></nav>用作頁面導航的鏈接組，其中可以包括<ul><li><p>元素等。
????5）<header></header>整個頁面或者頁面內容區塊的標題，可以包含其他內容。
????6）<footer></footer>頁腳，頁面底部或者版塊的內容。
????7）<hgroup></hgroup>頁面上標題的組合，通常對h1~h6進行分組。
????8）<figure></figure>通常用于圖片，統計圖或代碼示例，帶有可選標題。將其從網頁上移除后不會對網頁上其他內容產生影響。
????9）<figcaption></figcaption>表示figure的標題，從屬于figure元素。
???10）<time></time>表示某個時間或者某個日期。其中pubdate屬性代表了文檔的發布日期，可以用到time標簽里。
6、HTML5新增的屬性有哪些。
????1）表單相關的屬性
??????·?對input（type=text）、select、textarea與button指定autofocus屬性。它以指定屬性的方式讓元素在畫面打開時自動獲得焦點。
??????·?對input（type=text）、textarea指定placeholder屬性，它會對用戶的輸入進行提示，提示用戶可以輸入的內容。
??????·?對input、output、select、textarea、button與fieldset指定form屬性。它聲明屬于哪個表單，然后將其放置在頁面的任何位置，而不失表單之內。
?????·?對input（type=text）、textarea指定required屬性。該屬性表示用戶提交時進行檢查，檢查該元素內必定要有輸入內容。
?????·?為input標簽增加幾個新的屬性：autocomplete、min、max、multiple、pattern與step。還有list屬性與datalist元素配合使用；datalist元素與autocomplete屬性配合使用。multiple屬性允許上傳時一次上傳多個文件； pattern屬性用于驗證輸入字段的模式，其實就是正則表達式。step 屬性規定輸入字段的合法數字間隔（假如 step="3"，則合法數字應該是 -3、0、3、6，以此類推），step 屬性可以與 max 以及 min 屬性配合使用，以創建合法值的范圍。
?????·?為input、button元素增加formaction、formenctype、formmethod、formnovalidate與formtarget屬性。用戶重載form元素的action、enctype、method、novalidate與target屬性。為fieldset元素增加disabled屬性，可以把它的子元素設為disabled狀態。
?????·?為input、button、form增加novalidate屬性，可以取消提交時進行的有關檢查，表單可以被無條件地提交。
????2）鏈接相關屬性
?????·?為a、area增加media屬性。規定目標 URL 是為什么類型的媒介/設備進行優化的。該屬性用于規定目標 URL 是為特殊設備（比如 iPhone）、語音或打印媒介設計的。該屬性可接受多個值。只能在 href 屬性存在時使用。
?????·?為area增加herflang和rel屬性。hreflang?屬性規定在被鏈接文檔中的文本的語言。只有當設置了 href 屬性時，才能使用該屬性。注釋：該屬性是純咨詢性的。rel?屬性規定當前文檔與被鏈接文檔/資源之間的關系。只有當使用 href 屬性時，才能使用 rel 屬性。
?????·?為link增加size屬性。sizes 屬性規定被鏈接資源的尺寸。只有當被鏈接資源是圖標時 (rel="icon")，才能使用該屬性。該屬性可接受多個值。值由空格分隔。
?????·?為base元素增加target屬性，主要是保持與a元素的一致性。
????3）其他屬性
?????·?為ol增加reversed屬性，它指定列表倒序顯示。
?????·?為meta增加charset屬性
?????·?為menu增加type和label屬性。label為菜單定義一個課件的標注，type屬性讓才當可以以上下文菜單、工具條與列表cande但三種形式出現。
?????·?為style增加scoped屬性。它允許我們為文檔的指定部分定義樣式，而不是整個文檔。如果使用 "scoped" 屬性，那么所規定的樣式只能應用到 style 元素的父元素及其子元素。
?????·?為script增減屬性，它定義腳本是否異步執行。async 屬性僅適用于外部腳本（只有在使用 src 屬性時）有多種執行外部腳本的方法：
?????·?如果 async="async"：腳本相對于頁面的其余部分異步地執行（當頁面繼續進行解析時，腳本將被執行）
?????·?如果不使用 async 且 defer="defer"：腳本將在頁面完成解析時執行
?????·?如果既不使用 async 也不使用 defer：在瀏覽器繼續解析頁面之前，立即讀取并執行腳本
?????·?為html元素增加manifest，開發離線web應用程序時他與API結合使用，定義一個URL，在這個URL上描述文檔的緩存信息。
?????·?為iframe增加撒個屬性，sandbox、seamless、srcdoc。用來提高頁面安全性，防止不信任的web頁面執行某些操作。
前端面試系列文章：
1、【前端面試】HTML5+CSS3初級面試1
2、【前端面試】HTML5+CSS3初級面試2
3、【前端面試】HTML5+CSS3初級面試3
4、【前端面試】HTML5+CSS3初級面試4
---------------------?
作者：Wendy-lxq?
來源：CSDN?
原文：https://blog.csdn.net/u010297791/article/details/54923001?
版權聲明：本文為博主原創文章，轉載請附上博文鏈接！
)
