2021年前端面試題-HTML篇
阿新 • • 發佈：2020-12-21
馬上就要迎來2021年，程式設計師的跳槽黃金期又要來了，想趕上金三銀四，就要從現在開始準備面試題啦~~
之前整理了一篇比較少的面試題，但是問題分類比較亂，所以這次蒐羅了各路牛人們的面試題加以整理，希望可以幫助到自己，也能幫助到過路的你
寶貝們衝！
1、<img>的title和alt有什麼區別?
1、alt： 圖片載入失敗時，顯示在網頁上的替代文字
2、title： 滑鼠放在上面時顯示的文字
3、alt 是必要屬性，title 非必要
2、html5有哪些新特性、移除了那些元素？
（1）新增特性 a、新增標籤 article、aside、audio、bdi、canvas、command、datalist、details、embed、figcaption、figure、footer、header、hgroup、keygen、mark、meter、nav、output、progress、rp、rt、ruby、section、
source、summary、time、track、video。 其中常用標籤：article、aside、audio、video、canvas、footer、header、nav、section
b、新增localStorage、sessionStorage
c、新增contenteditable屬性 （任何dom節點只要加上contenteditable="true"就可以變得可編輯）
d、Geolocation 地理定位
（2）移除特性
<basefont> 預設字型，不設定字型，以此渲染， <font> 字型標籤， <center> 水平居中， <u> 下劃線， <big> 大字型， <strike> 中橫線， <tt> 文字等寬
3、WEB標準以及W3C標準是什麼?
1、標籤閉合
2、標籤小寫
3、巢狀正確
4、外部連結css和js
5、提倡結構、表現和行為相分離（HTML結構、CSS表現、JavaScript行為）
4、xhtml和html有什麼區別?
1、XHTML 元素必須被正確地巢狀。
2、XHTML 元素必須被關閉。
3、標籤名必須用小寫字母。
4、XHTML 文件必須擁有根元素。
5、Doctype作用? 嚴格模式與混雜模式如何區分？它們有何意義?
1. <!DOCTYPE> 宣告位於文件中的最前面，處於 <html> 標籤之前。告知瀏覽器以何種模式來渲染文件。
6、行內元素有哪些？塊級元素有哪些？ 空(void)元素有那些？行內元素和塊級元素有什麼區別？
行內元素
1、設定寬高無效
2、對margin僅設定左右方向有效，上下無效；padding上下左右都有效，會撐大空間
3、不會自動進行換行
塊級元素
1、能夠識別設定寬高
2、margin和padding的上下左右均對其有效
3、獨佔一行
7、HTML全域性屬性(global attribute)有哪些
html屬性賦予元素意義和語境，可以用於任何的html元素
1、class：為元素設定類標識
2、data-*：為元素增加自定義屬性
3、id：元素id，文件內唯一
4、lang：元素內容的語言
5、style：行內css樣式
6、title：元素相關的建議資訊
7、dir：規定元素中內容的文字方向（ltr：從左到右， rtl：從右到左）
8、contenteditable：html新增屬性，設定true後可編輯元素
9、hidden：隱藏一個html元素
8、Canvas和SVG有什麼區別？
Canvas
1、可伸縮向量圖形
2、放大縮小不會失真
SVG
1、HTML5新加的元素
2、使用XML描述2D圖形的語言
9、HTML5 為什麼只需要寫 <!DOCTYPE HTML>？
<!DOCTYPE HTML> 是文件型別宣告，它聲明瞭文件型別為html5，告訴瀏覽器和其他開發者，該文件使用的是html5標準