Html篇：
1.HTML5 爲什麼只需要寫 <!DOCTYPE HTML>？
HTML5 不基於 SGML，因此不需要對DTD進行引用，但是需要doctype來規範瀏覽器的行爲（讓瀏覽器按照它們應該的方式來運行）；
而HTML4.01基於SGML,所以需要對DTD進行引用，才能告知瀏覽器文檔所使用的文檔類型。
2.簡述一下src與href的區別。
答案：
src用於替換當前元素，href用於在當前文檔和引用資源之間確立聯繫。
src是source的縮寫，指向外部資源的位置，指向的內容將會嵌入到文檔中當前標籤所在位置；在請求src資源時會將其指向的資源下載並應用到文檔內，例如js腳本，img圖片和frame等元素。
<script src ="js.js"></script>
當瀏覽器解析到該元素時，會暫停其他資源的下載和處理，直到將該資源加載、編譯、執行完畢，圖片和框架等元素也如此，類似於將所指向資源嵌入當前標籤內。這也是爲什麼將js腳本放在底部而不是頭部。
href是Hypertext Reference的縮寫，指向網絡資源所在位置，建立和當前元素（錨點）或當前文檔（鏈接）之間的鏈接，如果我們在文檔中添加
<link href="common.css" rel="stylesheet"/>
那麼瀏覽器會識別該文檔爲css文件，就會並行下載資源並且不會停止對當前文檔的處理。這也是爲什麼建議使用link方式來加載css，而不是使用@import方式。
3.知道的網頁製作會用到的圖片格式有哪些？
答案：
png-8，png-24，jpeg，gif，svg。
但是上面的那些都不是面試官想要的最後答案。面試官希望聽到是Webp,Apng。（是否有關注新技術，新鮮事物）
科普一下Webp：WebP格式，谷歌（google）開發的一種旨在加快圖片加載速度的圖片格式。圖片壓縮體積大約只有JPEG的2/3，並能節省大量的服務器帶寬資源和數據空間。Facebook Ebay等知名網站已經開始測試並使用WebP格式。
在質量相同的情況下，WebP格式圖像的體積要比JPEG格式圖像小40%。
Apng：全稱是“Animated Portable Network Graphics”, 是PNG的位圖動畫擴展，可以實現png格式的動態圖片效果。04年誕生，但一直得不到各大瀏覽器廠商的支持，直到日前得到 iOS safari 8的支持，有望代替GIF成爲下一代動態圖標準。
4.知道什麼是微格式嗎？談談理解。在前端構建中應該考慮微格式嗎？
答案：
微格式（Microformats）是一種讓機器可讀的語義化XHTML詞彙的集合，是結構化數據的開放標準。是爲特殊應用而制定的特殊格式。
優點：將智能數據添加到網頁上，讓網站內容在搜索引擎結果界面可以顯示額外的提示。（應用範例：豆瓣，有興趣自行google）
5.在css/js代碼上線之後開發人員經常會優化性能，從用戶刷新網頁開始，一次js請求一般情況下有哪些地方會有緩存處理？
答案：dns緩存，cdn緩存，瀏覽器緩存，服務器緩存。
6.一個頁面上有大量的圖片（大型電商網站），加載很慢，你有哪些方法優化這些圖片的加載，給用戶更好的體驗。
- 圖片懶加載，在頁面上的未可視區域可以添加一個滾動條事件，判斷圖片位置與瀏覽器頂端的距離與頁面的距離，如果前者小於後者，優先加載。
- 如果爲幻燈片、相冊等，可以使用圖片預加載技術，將當前展示圖片的前一張和後一張優先下載。
- 如果圖片爲css圖片，可以使用CSSsprite，SVGsprite，Iconfont、Base64等技術。
- 如果圖片過大，可以使用特殊編碼的圖片，加載時會先加載一張壓縮的特別厲害的縮略圖，以提高用戶體驗。
- 如果圖片展示區域小於圖片的真實大小，則因在服務器端根據業務需要先行進行圖片壓縮，圖片壓縮後大小與展示一致。
7.你如何理解HTML結構的語義化？
- 去掉或樣式丟失的時候能讓頁面呈現清晰的結構：
html本身是沒有表現的，我們看到例如<h1>是粗體，字體大小2em，加粗；<strong>是加粗的，不要認爲這是html的表現，這些其實html默認的css樣式在起作用，所以去掉或樣式丟失的時候能讓頁面呈現清晰的結構不是語義化的HTML結構的優點，但是瀏覽器都有有默認樣式，默認樣式的目的也是爲了更好的表達html的語義，可以說瀏覽器的默認樣式和語義化的HTML結構是不可分割的。
- 屏幕閱讀器（如果訪客有視障）會完全根據你的標記來“讀”你的網頁.
例如,如果你使用的含語義的標記,屏幕閱讀器就會“逐個拼出”你的單詞,而不是試着去對它完整發音.
- PDA、手機等設備可能無法像普通電腦的瀏覽器一樣來渲染網頁（通常是因爲這些設備對CSS的支持較弱）
使用語義標記可以確保這些設備以一種有意義的方式來渲染網頁.理想情況下,觀看設備的任務是符合設備本身的條件來渲染網頁.
語義標記爲設備提供了所需的相關信息,就省去了你自己去考慮所有可能的顯示情況（包括現有的或者將來新的設備）.例如,一部手機可以選擇使一段標記了標題的文字以粗體顯示.而掌上電腦可能會以比較大的字體來顯示.無論哪種方式一旦你對文本標記爲標題,您就可以確信讀取設備將根據其自身的條件來合適地顯示頁面.
- 搜索引擎的爬蟲也依賴於標記來確定上下文和各個關鍵字的權重
過去你可能還沒有考慮搜索引擎的爬蟲也是網站的“訪客”,但現在它們他們實際上是極其寶貴的用戶.沒有他們的話,搜索引擎將無法索引你的網站,然後一般用戶將很難過來訪問.
- 你的頁面是否對爬蟲容易理解非常重要,因爲爬蟲很大程度上會忽略用於表現的標記,而只注重語義標記.
因此,如果頁面文件的標題被標記,而不是,那麼這個頁面在搜索結果的位置可能會比較靠後.除了提升易用性外,語義標記有利於正確使用CSS和JavaScript,因爲其本身提供了許多“鉤鉤”來應用頁面的樣式與行爲.
SEO主要還是靠你網站的內容和外部鏈接的。
- 便於團隊開發和維護
W3C給我們定了一個很好的標準，在團隊中大家都遵循這個標準，可以減少很多差異化的東西，方便開發和維護，提高開發效率，甚至實現模塊化開發。
8.談談以前端角度出發做好SEO需要考慮什麼？
- 瞭解搜索引擎如何抓取網頁和如何索引網頁
你需要知道一些搜索引擎的基本工作原理，各個搜索引擎之間的區別，搜索機器人（SE robot 或叫 web crawler）如何進行工作，搜索引擎如何對搜索結果進行排序等等。
- Meta標籤優化
主要包括主題（Title)，網站描述(Description)，和關鍵詞（Keywords）。還有一些其它的隱藏文字比如Author（作者），Category（目錄），Language（編碼語種）等。
- 如何選取關鍵詞並在網頁中放置關鍵詞
搜索就得用關鍵詞。關鍵詞分析和選擇是SEO最重要的工作之一。首先要給網站確定主關鍵詞（一般在5個上下），然後針對這些關鍵詞進行優化，包括關鍵詞密度（Density），相關度（Relavancy），突出性（Prominency）等等。
- 瞭解主要的搜索引擎
雖然搜索引擎有很多，但是對網站流量起決定作用的就那麼幾個。比如英文的主要有Google，Yahoo，Bing等；中文的有百度，搜狗，有道等。不同的搜索引擎對頁面的抓取和索引、排序的規則都不一樣。還要了解各搜索門戶和搜索引擎之間的關係，比如AOL網頁搜索用的是Google的搜索技術，MSN用的是Bing的技術。
- 主要的互聯網目錄
Open Directory自身不是搜索引擎，而是一個大型的網站目錄，他和搜索引擎的主要區別是網站內容的收集方式不同。目錄是人工編輯的，主要收錄網站主頁；搜索引擎是自動收集的，除了主頁外還抓取大量的內容頁面。
- 按點擊付費的搜索引擎
搜索引擎也需要生存，隨着互聯網商務的越來越成熟，收費的搜索引擎也開始大行其道。最典型的有Overture和百度，當然也包括Google的廣告項目Google Adwords。越來越多的人通過搜索引擎的點擊廣告來定位商業網站，這裏面也大有優化和排名的學問，你得學會用最少的廣告投入獲得最多的點擊。
- 搜索引擎登錄
網站做完了以後，別躺在那裏等着客人從天而降。要讓別人找到你，最簡單的辦法就是將網站提交（submit）到搜索引擎。如果你的是商業網站，主要的搜索引擎和目錄都會要求你付費來獲得收錄（比如Yahoo要299美元），但是好消息是（至少到目前爲止）最大的搜索引擎Google目前還是免費，而且它主宰着60％以上的搜索市場。
- 鏈接交換和鏈接廣泛度（Link Popularity）
網頁內容都是以超文本（Hypertext）的方式來互相鏈接的，網站之間也是如此。除了搜索引擎以外，人們也每天通過不同網站之間的鏈接來Surfing（“衝浪”）。其它網站到你的網站的鏈接越多，你也就會獲得更多的訪問量。更重要的是，你的網站的外部鏈接數越多，會被搜索引擎認爲它的重要性越大，從而給你更高的排名。
- 合理的標籤使用
8.行內元素有哪些？塊級元素有哪些？ 空(void)元素有那些？
首先：CSS規範規定，每個元素都有display屬性，確定該元素的類型，每個元素都有默認的display值，如div的display默認值爲“block”，則爲“塊級”元素；span默認display屬性值爲“inline”，是“行內”元素。
（1）行內元素有：a b span img input select strong（強調的語氣）
（2）塊級元素有：div ul ol li dl dt dd h1 h2 h3 h4…p
（3）常見的空元素：
<br> <hr> <img> <input> <link> <meta>
鮮爲人知的是：
<area> <base> <col> <command> <embed> <keygen> <param> <source> <track> <wbr>
不同瀏覽器（版本）、HTML4（5）、CSS2等實際略有差異
9.頁面導入樣式時，使用link和@import有什麼區別？
（1）link屬於XHTML標籤，除了加載CSS外，還能用於定義RSS, 定義rel連接屬性等作用；而@import是CSS提供的，只能用於加載CSS;
（2）頁面被加載的時，link會同時被加載，而@import引用的CSS會等到頁面被加載完再加載;
（3）import是CSS2.1 提出的，只在IE5以上才能被識別，而link是XHTML標籤，無兼容問題;
(4)link支持使用js控制DOM去改變樣式，而@import不支持;
10.介紹一下你對瀏覽器內核的理解？
主要分成兩部分：渲染引擎(layout engineer或Rendering Engine)和JS引擎。
渲染引擎：負責取得網頁的內容（HTML、XML、圖像等等）、整理訊息（例如加入CSS等），以及計算網頁的顯示方式，然後會輸出至顯示器或打印機。瀏覽器的內核的不同對於網頁的語法解釋會有不同，所以渲染的效果也不相同。所有網頁瀏覽器、電子郵件客戶端以及其它需要編輯、顯示網絡內容的應用程序都需要內核。
JS引擎則：解析和執行javascript來實現網頁的動態效果。
最開始渲染引擎和JS引擎並沒有區分的很明確，後來JS引擎越來越獨立，內核就傾向於只指渲染引擎。
11.常見的瀏覽器內核有哪些？
Trident內核：IE,MaxThon,TT,The World,360,搜狗瀏覽器等。[又稱MSHTML]
Gecko內核： Netscape6及以上版本，FF,MozillaSuite/SeaMonkey等
Presto內核：Opera7及以上。 [Opera內核原爲：Presto，現爲：Blink;]
Webkit內核：Safari,Chrome等。 [ Chrome的：Blink（WebKit的分支）]
詳細文章：[瀏覽器內核的解析和對比](http://www.cnblogs.com/fullhouse/archive/2011/12/19/2293455.html)
12.請描述一下 cookies，sessionStorage 和 localStorage 的區別？
cookie是網站爲了標示用戶身份而儲存在用戶本地終端（Client Side）上的數據（通常經過加密）。
cookie數據始終在同源的http請求中攜帶（即使不需要），記會在瀏覽器和服務器間來回傳遞。
sessionStorage和localStorage不會自動把數據發給服務器，僅在本地保存。
存儲大小：
cookie數據大小不能超過4k。
sessionStorage和localStorage 雖然也有存儲大小的限制，但比cookie大得多，可以達到5M或更大。
有期時間：
localStorage 存儲持久數據，瀏覽器關閉後數據不丟失除非主動刪除數據；
sessionStorage 數據在當前瀏覽器窗口關閉後自動刪除。
cookie 設置的cookie過期時間之前一直有效，即使窗口或瀏覽器關閉
https://blog.csdn.net/muzidigbig/article/details/82085215
13.iframe有那些缺點？
*iframe會阻塞主頁面的Onload事件；
*搜索引擎的檢索程序無法解讀這種頁面，不利於SEO;
*iframe和主頁面共享連接池，而瀏覽器對相同域的連接有限制，所以會影響頁面的並行加載。
使用iframe之前需要考慮這兩個缺點。如果需要使用iframe，最好是通過javascript
動態給iframe添加src屬性值，這樣可以繞開以上兩個問題。
14.Label的作用是什麼？是怎麼用的？
label標籤來定義表單控制間的關係,當用戶選擇該標籤時，瀏覽器會自動將焦點轉到和標籤相關的表單控件上。
<label for="Name">Number:</label>
<input type=“text“name="Name" id="Name"/>
<label>Date:<input type="text" name="B"/></label>
15.HTML5的form如何關閉自動完成功能？
給不想要提示的 form 或某個 input 設置爲 autocomplete=off。
16.實現不使用 border 畫出1px高的線，在不同瀏覽器的標準模式與怪異模式下都能保持一致的效果。
<div style="height:1px;overflow:hidden;background:red"></div>
17.title與h1的區別、b與strong的區別、i與em的區別？
title屬性沒有明確意義只表示是個標題，H1則表示層次明確的標題，對頁面信息的抓取也有很大的影響；
strong是標明重點內容，有語氣加強的含義，使用閱讀設備閱讀網絡時：<strong>會重讀，而<B>是展示強調內容。
i內容展示爲斜體，em表示強調的文本；
Physical Style Elements -- 自然樣式標籤
b, i, u, s, pre
Semantic Style Elements -- 語義樣式標籤
strong, em, ins, del, code
應該準確使用語義樣式標籤, 但不能濫用, 如果不能確定時首選使用自然樣式標籤。
Css篇：
1.超鏈接訪問過後hover樣式就不出現的問題是什麼？如何解決？
答案：被點擊訪問過的超鏈接樣式不在具有hover和active了,解決方法是改變CSS屬性的排列順序: L-V-H-A（link,visited,hover,active）
2.行內元素和塊級元素的具體區別是什麼？行內元素的padding和margin可設置嗎？
塊級元素(block)特性：
- 總是獨佔一行，表現爲另起一行開始，而且其後的元素也必須另起一行顯示;
- 寬度(width)、高度(height)、內邊距(padding)和外邊距(margin)都可控制;
內聯元素(inline)特性：
- 和相鄰的內聯元素在同一行;
- 寬度(width)、高度(height)、內邊距的top/bottom(padding-top/padding-bottom)和外邊距的top/bottom(margin-top/margin-bottom)都不可改變（也就是padding和margin的left和right是可以設置的），就是裏面文字或圖片的大小。
那麼問題來了，瀏覽器還有默認的天生inline-block元素（擁有內在尺寸，可設置高寬，但不會自動換行），有哪些？
答案：<input> 、<img> 、<button> 、<textarea> 、<label>。
3.rgba()和opacity的透明效果有什麼不同？
答案：
rgba()和opacity都能實現透明效果，但最大的不同是opacity作用於元素，以及元素內的所有內容的透明度，
而rgba()只作用於元素的顏色或其背景色。（設置rgba透明的元素的子元素不會繼承透明效果！）
4.如何垂直居中一個<img>?（用更簡便的方法。）
#container //<img>的容器設置如下
{
display:table-cell;
text-align:center;
vertical-align:middle;
}
5.知道css有個content屬性嗎？有什麼作用？有什麼應用？
答案：
知道。css的content屬性專門應用在 before/after 僞元素上，用於來插入生成內容。
最常見的應用是利用僞類清除浮動。
//一種常見利用僞類清除浮動的代碼
.clearfix:after {
content:"."; //這裏利用到了content屬性
display:block;
height:0;
visibility:hidden;
clear:both; }
.clearfix {
*zoom:1;
}
after僞元素通過 content 在元素的後面生成了內容爲一個點的塊級元素，再利用clear:both清除浮動。
那麼問題繼續還有，知道css計數器（序列數字字符自動遞增）嗎？如何通過css content屬性實現css計數器？
答案：css計數器是通過設置counter-reset 、counter-increment 兩個屬性 、及 counter()/counters()一個方法配合after / before 僞類實現。
6.介紹一下標準的CSS的盒子模型？低版本IE的盒子模型有什麼不同的？
（1）有兩種， IE 盒子模型、W3C 盒子模型；
（2）盒模型： 內容(content)、填充(padding)、邊界(margin)、 邊框(border)；
（3）區 別： IE的content部分把 border 和 padding計算了進去;
7.CSS選擇符哪些屬性可以繼承？
* 可繼承的樣式： font-size font-family color, UL LI DL DD DT;
* 不可繼承的樣式：border padding margin width height ;
8.display有哪些值？說明他們的作用。
block 塊類型。默認寬度爲父元素寬度，可設置寬高，換行顯示。
none 元素不顯示，並從文檔流中移除。
inline 行內元素類型。默認寬度爲內容寬度，不可設置寬高，同行顯示。
inline-block 默認寬度爲內容寬度(會多出間隙)，可以設置寬高，同行顯示。
list-item 象塊類型元素一樣顯示，並添加樣式列表標記。
table 此元素會作爲塊級表格來顯示。
inherit 規定應該從父元素繼承 display 屬性的值。
9.請解釋一下CSS3的Flexbox（彈性盒佈局模型）,以及適用場景？
一個用於頁面佈局的全新CSS3功能，Flexbox可以把列表放在同一個方向（從上到下排列，從左到右），並讓列表能延伸到佔用可用的空間。
較爲複雜的佈局還可以通過嵌套一個伸縮容器（flex container）來實現。
採用Flex佈局的元素，稱爲Flex容器（flex container），簡稱"容器"。
它的所有子元素自動成爲容器成員，稱爲Flex項目（flex item），簡稱"項目"。
常規佈局是基於塊和內聯流方向，而Flex佈局是基於flex-flow流可以很方便的用來做局中，能對不同屏幕大小自適應。
在佈局上有了比以前更加靈活的空間。
具體：http://www.w3cplus.com/css3/flexbox-basics.html
10.用純CSS創建一個三角形的原理是什麼？
把上、左、右三條邊隱藏掉（顏色設爲 transparent）
#demo {
width: 0;
height: 0;
border-width: 20px;
border-style: solid;
border-color: transparent transparent red transparent;
}
11.一個滿屏 品 字佈局 如何設計?
簡單的方式：
上面的div寬100%，
下面的兩個div分別寬50%，
然後用float或者inline使其不換行即可
12.經常遇到的瀏覽器的兼容性有哪些？原因，解決方法是什麼，常用hack的技巧 ？
* png24位的圖片在iE6瀏覽器上出現背景，解決方案是做成PNG8.
* 瀏覽器默認的margin和padding不同。解決方案是加一個全局的*{margin:0;padding:0;}來統一。
* IE6雙邊距bug:塊屬性標籤float後，又有橫行的margin情況下，在ie6顯示margin比設置的大。
浮動ie產生的雙倍距離 #box{ float:left; width:10px; margin:0 0 0 100px;}
這種情況之下IE會產生20px的距離，解決方案是在float的標籤樣式控制中加入 ——_display:inline;將其轉化爲行內屬性。(_這個符號只有ie6會識別)
漸進識別的方式，從總體中逐漸排除局部。
首先，巧妙的使用“\9”這一標記，將IE遊覽器從所有情況中分離出來。
接着，再次使用“+”將IE8和IE7、IE6分離開來，這樣IE8已經獨立識別。
css
.bb{
background-color:red;/*所有識別*/
background-color:#00deff\9; /*IE6、7、8識別*/
+background-color:#a200ff;/*IE6、7識別*/
_background-color:#1e0bd1;/*IE6識別*/
}
* IE下,可以使用獲取常規屬性的方法來獲取自定義屬性,
也可以使用getAttribute()獲取自定義屬性;
Firefox下,只能使用getAttribute()獲取自定義屬性。
解決方法:統一通過getAttribute()獲取自定義屬性。
* IE下,even對象有x,y屬性,但是沒有pageX,pageY屬性;
Firefox下,event對象有pageX,pageY屬性,但是沒有x,y屬性。
* 解決方法：（條件註釋）缺點是在IE瀏覽器下可能會增加額外的HTTP請求數。
* Chrome 中文界面下默認會將小於 12px 的文本強制按照 12px 顯示,
可通過加入 CSS 屬性 -webkit-text-size-adjust: none; 解決。
超鏈接訪問過後hover樣式就不出現了 被點擊訪問過的超鏈接樣式不在具有hover和active瞭解決方法是改變CSS屬性的排列順序:
L-V-H-A : a:link {} a:visited {} a:hover {} a:active {}
13.對BFC規範(塊級格式化上下文：block formatting context)的理解？
（W3C CSS 2.1 規範中的一個概念,它是一個獨立容器，決定了元素如何對其內容進行定位,以及與其他元素的關係和相互作用。）
一個頁面是由很多個 Box 組成的,元素的類型和 display 屬性,決定了這個 Box 的類型。
不同類型的 Box,會參與不同的 Formatting Context（決定如何渲染文檔的容器）,因此Box內的元素會以不同的方式渲染,也就是說BFC內部的元素和外部的元素不會互相影響。
14.請解釋一下爲什麼需要清除浮動？清除浮動的方式
清除浮動是爲了清除使用浮動元素產生的影響。浮動的元素，高度會塌陷，而高度的塌陷使我們頁面後面的佈局不能正常顯示。
https://blog.csdn.net/muzidigbig/article/details/80413176
15.什麼是外邊距合併？
外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成一個外邊距。
合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。
w3school介紹網址： http://www.w3school.com.cn/css/css_margin_collapsing.asp
16.zoom:1的清除浮動原理?
清除浮動，觸發hasLayout；
Zoom屬性是IE瀏覽器的專有屬性，它可以設置或檢索對象的縮放比例。解決ie下比較奇葩的bug。
譬如外邊距（margin）的重疊，浮動清除，觸發ie的haslayout屬性等。
來龍去脈大概如下：
當設置了zoom的值之後，所設置的元素就會就會擴大或者縮小，高度寬度就會重新計算了，這裏一旦改變zoom值時其實也會發生重新渲染，運用這個原理，也就解決了ie下子元素浮動時候父元素不隨着自動擴大的問題。
Zoom屬是IE瀏覽器的專有屬性，火狐和老版本的webkit核心的瀏覽器都不支持這個屬性。然而，zoom現在已經被逐步標準化，出現在 CSS 3.0 規範草案中。
目前非ie由於不支持這個屬性，它們又是通過什麼屬性來實現元素的縮放呢？
可以通過css3裏面的動畫屬性scale進行縮放。
17.CSS優化、提高性能的方法有哪些？
關鍵選擇器（key selector）。選擇器的最後面的部分爲關鍵選擇器（即用來匹配目標元素的部分）；
如果規則擁有 ID 選擇器作爲其關鍵選擇器，則不要爲規則增加標籤。過濾掉無關的規則（這樣樣式系統就不會浪費時間去匹配它們了）；
提取項目的通用公有樣式，增強可複用性，按模塊編寫組件；增強項目的協同開發性、可維護性和可擴展性;
使用預處理工具或構建工具（gulp對css進行語法檢查、自動補前綴、打包壓縮、自動優雅降級）；
18.瀏覽器是怎樣解析CSS選擇器的？
樣式系統從關鍵選擇器開始匹配，然後左移查找規則選擇器的祖先元素。
只要選擇器的子樹一直在工作，樣式系統就會持續左移，直到和規則匹配，或者是因爲不匹配而放棄該規則。
19.在網頁中的應該使用奇數還是偶數的字體？爲什麼呢？
https://blog.csdn.net/jian_xi/article/details/79346477
20.如何修改chrome記住密碼後自動填充表單的黃色背景 ？
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
background-color: rgb(250, 255, 189); /* #FAFFBD; */
background-image: none;
color: rgb(0, 0, 0);
}
21.設置元素浮動後，該元素的display值是多少？
自動變成了 display:block
22.讓頁面裏的字體變清晰，變細用CSS怎麼做？(兼容)
-webkit-font-smoothing: antialiased;
https://www.jianshu.com/p/0c1cf3fafe60
23.position:fixed;在android下無效怎麼處理？
fixed的元素是相對整個頁面固定位置的，你在屏幕上滑動只是在移動這個所謂的viewport，
原來的網頁還好好的在那，fixed的內容也沒有變過位置，
所以說並不是iOS不支持fixed，只是fixed的元素不是相對手機屏幕固定的。
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>
24.如果需要手動寫動畫，你認爲最小時間間隔是多久，爲什麼？（阿里）
多數顯示器默認頻率是60Hz，即1秒刷新60次，所以理論上最小間隔爲1/60＊1000ms ＝ 16.7ms
25.display:inline-block 什麼時候會顯示間隙？(攜程)
移除空格、使用margin負值、使用font-size:0、letter-spacing、word-spacing
26.overflow: scroll時不能平滑滾動的問題怎麼處理？
https://blog.csdn.net/chiuwingyan/article/details/80424435