1，什么是cssreset ?

顧名思義，css reset，樣式重置。即重新設(shè)置界面的樣式。

? ? ? ? CSS reset，又叫做 CSS 重寫或者 CSS 重置，用于改寫HTML標(biāo)簽的默認(rèn)樣式。 有些HTML標(biāo)簽在瀏覽器里有默認(rèn)的樣式，例如 p 標(biāo)簽有上下邊距，li 標(biāo)簽有列表標(biāo)識符號等。一開始，CSS的工作方式?jīng)]有完全標(biāo)準(zhǔn)化。各個瀏覽器將自認(rèn)為合適的“邊框”，“填充”，“邊距”，“字體”，“行高”等樣式加載到一些基礎(chǔ)元素（input，div，a，span）中，以賦予頁面獨特的感覺。這些默認(rèn)樣式在不同瀏覽器之間也會有差別，例如ul默認(rèn)帶有縮進的樣式，在IE下，它的縮進是通過margin實現(xiàn)的，而Firefox下，它的縮進是由padding實現(xiàn)的。這必然會帶來瀏覽器兼容問題。 因此，很基礎(chǔ)的html元素在IE，Chrome，Firefox，Opera中的顯示不盡相同。為了避免頁面在不同的瀏覽器上有不同的效果，我們通常需要顯示地對html元素的css樣式進行一些默認(rèn)設(shè)置，來將“瀏覽器自帶的設(shè)置”重置掉，這個就叫做CSS Reset。

2，為什么要用到cssreset?

如果你不定義HTML元素的默認(rèn)css樣式，那么瀏覽器自己就會用它自己的默認(rèn)樣式；但由于不同瀏覽器的默認(rèn)樣式是不一樣的，會導(dǎo)致你開發(fā)的頁面在不同瀏覽器上會看上去不太一樣。

不同的瀏覽器在實現(xiàn)w3c標(biāo)準(zhǔn)過程中，對各個元素的實現(xiàn)是不一致的。這就導(dǎo)致了同一個頁面在不同的瀏覽器中比如ie和chrome中，表現(xiàn)有差異。為了解決這個問題，即不同瀏覽器中表現(xiàn)的一致性，需要使用css reset。

3，如何使用css reset？

這個很簡單，頁面的頭部引入css文件即可。

在頭部直接添加style 標(biāo)簽。

*{margin: 0;padding: 0;}

但是這種做法的缺點在于，使用*來匹配所有的元素，這樣會降低效率，會影頁面的渲染性能。其次，很多不必要reset的元素也一刀切式地reset了。最后就是這個做法太過于簡單，無法實現(xiàn)精細(xì)化的reset。

后來，有人整了專門的css reset。

比如最常見的兩種：reset.css和normalize.css。

后者被bootstrap所采用。normalize.css修復(fù)了不同瀏覽器常見的不一致，規(guī)范化常見的組件風(fēng)格，保存有用的默認(rèn)值。因此，選擇用Normalize.css來取代其它的CSS Resets。

4，辯證的判斷是否需要CSS Reset

• CSS Reset的主要目標(biāo)是確保瀏覽器之間的一致性，并撤消所有默認(rèn)樣式，創(chuàng)建一個空白板。

• 如今瀏覽器在布局或間距方面并沒有太大的差異?？偟膩碚f，瀏覽器忠實地實現(xiàn)了CSS規(guī)范，所以不再那么需要了。

• 我們應(yīng)該根據(jù)實際的需求辯證的判斷是否需要CSS Reset，保持簡潔，高效即可。

• 下面列出一個比較合適的CSS Reset模板，不會完全重置瀏覽器的默認(rèn)樣式而帶來不便，同時能夠避免一些常見的瀏覽器兼容性的問題。

5，使用CSS Reset的弊端

其實也有很多“不建議使用CSS Reset”的

1. 所有的html元素都需要重新設(shè)置，會增加css文件的大小

2. 如果重置掉一些基礎(chǔ)屬性，開發(fā)時會容易忘掉補充這些屬性，反而引入顯示混亂的問題

3. 重置掉一些屬性會影響用戶通過鍵盤快捷鍵操作