2019web前端全新面試題及答案

　　一、頁面導入樣式時，使用link和@import有什麼區別?

　　答案：差異1：本質的差異：link屬於XHTML標籤，而@import徹底是CSS提供的一種方式。

　　差異2：加載順序的差異：當一個頁面被加載的時候(就是被瀏覽者瀏覽的時候)，link引用的CSS會同時被加載，而@import引用的CSS會等到頁面所有被下載完再被加載。因此有時候瀏覽@import加載CSS的頁面時開始會沒有樣式(就是閃爍)，網速慢的時候還挺明顯。

　　差異3：兼容性的差異：@import是CSS2.1提出的，因此老的瀏覽器不支持，@import只有在IE5以上的才能識別，而link標籤無此問題。

　　差異4：使用dom(document o bject model文檔對象模型 )控制樣式時的差異：當使用javascript控制dom去改變樣式的時候，只能使用link標籤，由於@import不是dom能夠控制的.

　　二、<img>標籤上title屬性與alt屬性的區別是什麼?

　　答案： title屬性是鼠標劃上去顯示的內容

　　alt屬性是爲了給那些不能看到你文檔中圖像的瀏覽者提供文字說明的。

　　三、請寫出至少5個html5新增的標籤，並說明其語義和應用場景

　　答案：section：定義文檔中的一個章節

　　nav：定義只包含導航連接的章節

　　header：定義頁面或章節的頭部。它常常包含 logo、頁面標題和導航性的目錄。

　　footer：定義頁面或章節的尾部。它常常包含版權信息、法律信息連接和反饋建議用的地址。

　　aside：定義和頁面內容關聯度較低的內容——若是被刪除，剩下的內容仍然很合理。

　　四、HTML與XHTML——兩者有什麼區別?

　　答案：

　　1) HTML 元素必須被正確地嵌套。

　　2) XHTML 元素必須被關閉。

　　3) 標籤名必須用小寫字母。

　　4) XHTML 文檔必須擁有根元素。

　　五、iframe的優缺點?

　　答案：優勢：

　　a. 解決加載緩慢的第三方內容如圖標和廣告等的加載問題

　　b. iframe無刷新文件上傳 c. iframe跨域通訊

　　缺點：

　　a. iframe會阻塞主頁面的Onload事件 b. 沒法被一些搜索引擎索引到

　　c. 頁面會增長服務器的http請求 d. 會產生不少頁面，不容易管理。

　　六、全屏滾動的原理是什麼?用到了CSS的哪些屬性?

　　答案：原理：有點相似於輪播，總體的元素一直排列下去，假設有5個須要展現的全屏頁面，那麼高度是500%，只是展現100%，剩下的能夠經過transform進行y軸定位，也能夠經過margin-top實現

　　overflow：hidden;transition：all 1000ms ease;

　　七、什麼是響應式設計?響應式設計的基本原理是什麼?如何兼容低版本的IE?

　　答案：響應式網站設計(Responsive Web design)是一個網站可以兼容多個終端，而不是爲每個終端作一個特定的版本。

　　基本原理是經過媒體查詢檢測不一樣的設備屏幕尺寸作處理。

　　頁面頭部必須有meta聲明的viewport。　

<meta name="viewport"content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

　　八、::before 和 :after中雙冒號和單冒號有什麼區別?解釋一下這2個僞元素的做用

　　答案：單冒號(:)用於CSS3僞類，雙冒號(::)用於CSS3僞元素。

　　::before就是以一個子元素的存在，定義在元素主體內容以前的一個僞元素。並不存在於dom之中，只存在在頁面之中。

　　:before 和 :after 這兩個僞元素，是在CSS2.1裏新出現的。起初，僞元素的前綴使用的是單冒號語法，但隨着Web的進化，在CSS3的規範裏，僞元素的語法被修改爲使用雙冒號，成爲::before ::after

　　九、怎麼讓Chrome支持小於12px 的文字?

　　答案：p{font-size:10px;-webkit-transform:scale(0.8);}//0.8是縮放比例

　　十、簡述一下你對HTML語義化的理解?

　　答案：一、用正確的標籤作正確的事情。

　　二、html語義化讓頁面的內容結構化，結構更清晰，便於對瀏覽器，搜索引擎解析;

　　三、即便在沒有樣式CSS狀況下也以一種文檔格式顯示，而且是容易閱讀的;

　　四、搜索引擎的爬蟲也依賴於HTML標記肯定上下文和各個關鍵字的權重，利用SEO;

　　五、使閱讀源代碼的人對網站更容易將網站分塊，便於閱讀維護理解。