1. 程式人生 > >給老鐵們一些前端面試題,關於HTML+CSS的

給老鐵們一些前端面試題,關於HTML+CSS的

1、你做的頁面在哪些流覽器測試過?這些瀏覽器的核心分別是什麼?
2、每個 HTML 檔案裡開頭都有個很重要的東西,Doctype,知道這是幹什麼的嗎?
3、Quirks 模式是什麼?它和 Standards 模式有什麼區別
4、div+css 的佈局較 table 佈局有什麼優點?
5、 img 的 alt 與 title 有何異同? strong 與 em 的異同?
6、你能描述一下漸進增強和優雅降級之間的不同嗎?
7、為什麼利用多個域名來儲存網站資源會更有效?
8、請談一下你對網頁標準和標準制定機構重要性的理解。
9、請描述一下 cookies,sessionStorage 和 localStorage 的區別?
10、簡述一下 src 與 href 的區別。
11、知道的網頁製作會用到的圖片格式有哪些?
12、知道什麼是微格式嗎?談談理解。在前端構建中應該考慮微格式嗎?
13、在 css/js 程式碼上線之後開發人員經常會優化效能,從使用者重新整理網頁開始,一次 js
請求一般情況下有哪些地方會有快取處理?
14、一個頁面上有大量的圖片(大型電商網站),載入很慢,你有哪些方法優化這些圖
片的載入,給使用者更好的體驗。
15、你如何理解 HTML 結構的語義化?
16、談談以前端角度出發做好 SEO 需要考慮什麼?
17、有哪項方式可以對一個 DOM 設定它的 CSS 樣式?
18、CSS 都有哪些選擇器?
19、CSS 中可以通過哪些屬性定義,使得一個 DOM 元素不顯示在瀏覽器可視範圍內?27
20、超連結訪問過後 hover 樣式就不出現的問題是什麼?如何解決?
21、什麼是 Css Hack?ie6,7,8 的 hack 分別是什麼?
22、請用 Css 寫一個簡單的幻燈片效果頁面
24、行內元素和塊級元素的具體區別是什麼?行內元素的padding和margin可設定嗎?
25、什麼是外邊距重疊?重疊的結果是什麼?
26、rgba()和 opacity 的透明效果有什麼不同?
27、css 中可以讓文字在垂直和水平方向上重疊的兩個屬性是什麼?
28、如何垂直居中一個浮動元素?
29、px 和 em 的區別。
30、描述一個”reset”的 CSS 檔案並如何使用它。知道 normalize.css 嗎?你瞭解他
們的不同之處?
31、Sass、LESS 是什麼?大家為什麼要使用他們?
32、display:none 與 visibility:hidden 的區別是什麼?
34、CSS 中 link 和@import 的區別是:
35、簡介盒子模型:
36、為什麼要初始化樣式?
37、BFC 是什麼?
38、html 語義化是什麼?
39、Doctype 的作用?嚴格模式與混雜模式的區別?
40、IE 的雙邊距 BUG:塊級元素 float 後設置橫向 margin,ie6 顯示的 margin 比設定
的較大。解決:加入_display:inline
41、HTML 與 XHTML——二者有什麼區別?
42、html 常見相容性問題?
43、對 WEB 標準以及 W3C 的理解與認識
44、行內元素有哪些?塊級元素有哪些?CSS 的盒模型?
45、前端頁面有哪三層構成,分別是什麼?作用是什麼?
46、Doctype 作用? 嚴格模式與混雜模式-如何觸發這兩種模式,區分它們有何意義?35
47、行內元素有哪些?塊級元素有哪些? 空(void)元素有那些?
48、CSS 的盒子模型?
49、CSS 選擇符有哪些?哪些屬性可以繼承?優先順序演算法如何計算? CSS3 新增偽類有
那些?
50、如何居中 div,如何居中一個浮動元素?
51、瀏覽器的核心分別是什麼?經常遇到的瀏覽器的相容性有哪些?原因,解決方法是
什麼,常用 hack 的技巧 ?.
52、列出 display 的值,說明他們的作用。position 的值, relative 和 absolute 定
位原點是?
53、absolute 的 containing block 計算方式跟正常流有什麼不同?
54、position 跟 display、margin collapse、overflow、float 這些特性相互疊加後
會怎麼樣?
55、對 WEB 標準以及 W3C 的理解與認識.
56、css 的基本語句構成是?
57、瀏覽器標準模式和怪異模式之間的區別是什麼?
58、CSS 中可以通過哪些屬性定義,使得一個 DOM 元素不顯示在瀏覽器可視範圍內?39
59、超連結訪問過後 hover 樣式就不出現的問題是什麼?如何解決?
60、什麼是 Css Hack?ie6,7,8 的 hack 分別是什麼?
62、請用 Css 寫一個簡單的幻燈片效果頁面
63、行內元素和塊級元素的具體區別是什麼?行內元素的padding和margin可設定嗎?
64、什麼是外邊距重疊?重疊的結果是什麼?
65、rgba()和 opacity 的透明效果有什麼不同?
66、css 中可以讓文字在垂直和水平方向上重疊的兩個屬性是什麼?
67、如何垂直居中一個浮動元素?
68、描述一個"reset"的 CSS 檔案並如何使用它。知道 normalize.css 嗎?你瞭解他們
的不同之處?
69、說 display 屬性有哪些?可以做什麼?
70、哪些 css 屬性可以繼承?
71、css 優先順序演算法如何計算?
72、b 標籤和 strong 標籤,i 標籤和 em 標籤的區別?
73、有那些行內元素、有哪些塊級元素、盒模型?
74、有哪些選擇符,優先順序的計算公式是什麼?行內樣式和!important 哪個優先順序高?
75.我想讓行內元素跟上面的元素距離 10px,加 margin-top 和 padding-top 可以嗎?45
76.CSS 的盒模型由什麼組成?
77、.說說 display 屬性有哪些?可以做什麼?
78、哪些 css 屬性可以繼承?
79、css 優先順序演算法如何計算?
80、text-align:center 和 line-height 有什麼區別?
81、前端頁面由哪三層構成,分別是什麼?作用是什麼?
82、寫一個表格以及對應的 CSS,使表格奇數行為白色背景,偶數行為灰色,滑鼠一上
去為黃色背景。