4.4 萬(wàn) Star！GitHub 和 Twitter 都在用的 CSS 庫(kù)
【導(dǎo)語(yǔ)】：Normalize.css 使瀏覽器呈現(xiàn)的所有元素更加一致，符合現(xiàn)代標(biāo)準(zhǔn)。它精確地只針對(duì)需要規(guī)范化的樣式。
簡(jiǎn)介
不同瀏覽器對(duì)于同一個(gè)元素會(huì)有不一樣的默認(rèn)樣式，normalize.css 采用和平且高效的方式，解決了瀏覽器默認(rèn)樣式的問(wèn)題，盡可能讓同一個(gè) CSS 文件在不同的瀏覽器上顯示一樣的效果。
normalize.css 是一個(gè)小的 CSS 文件，它在 HTML 元素的默認(rèn)樣式中提供了更好的跨瀏覽器一致性。它是一種現(xiàn)代的、支持 HTML5 的、替代傳統(tǒng) CSS reset 的方法。
目前 Twitter、GitHub、Medium、Guardian、GOV.UK、CSS Tricks 和 Bootstrap 等許多其他框架、工具包和站點(diǎn)都在使用。
主要作用：
與許多 CSS reset 不同，保留有用的默認(rèn)值，而非刪除它們。 標(biāo)準(zhǔn)化各種元素的樣式。 糾正錯(cuò)誤和常見(jiàn)的瀏覽器不一致問(wèn)題。 通過(guò)細(xì)微的修改提高可用性。 使用詳細(xì)注釋解釋代碼的作用。
它支持范圍廣泛的瀏覽器（包括移動(dòng)瀏覽器），并包含對(duì) HTML5 元素、排版、列表、嵌入內(nèi)容、表單和表格進(jìn)行規(guī)范化。
Chrome Edge Firefox ESR+ IE 10+ Safari 8+ Opera
項(xiàng)目地址是：
https://github.com/necolas/normalize.css
下載安裝
npm
npm install --save normalize.css
CDN
https://yarnpkg.com/en/package/normalize.css
直接下載
https://necolas.github.io/normalize.css/latest/normalize.css
簡(jiǎn)單使用
normalize.css 修復(fù)了 CSS reset 范圍之外的常見(jiàn)桌面和移動(dòng)瀏覽器錯(cuò)誤。包括 HTML5 元素的顯示設(shè)置、更正 font-size 預(yù)格式文本、IE9 中的 SVG 溢出以及跨瀏覽器和操作系統(tǒng)的許多與表單相關(guān)的錯(cuò)誤。
normalize.css 使新的 HTML5 search 輸入類(lèi)型跨瀏覽器一致和樣式化：
/**
* 1. Addresses appearance set to searchfield in S5, Chrome
* 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof)
*/
input[type="search"] {
-webkit-appearance: textfield; /* 1 */
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box; /* 2 */
box-sizing: content-box;
}
/**
* Removes inner padding and search cancel button in S5, Chrome on OS X
*/
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
-webkit-appearance: none;
}
- EOF -
更多優(yōu)秀開(kāi)源項(xiàng)目（點(diǎn)擊下方圖片可跳轉(zhuǎn)）
開(kāi)源前哨
日常分享熱門(mén)、有趣和實(shí)用的開(kāi)源項(xiàng)目。參與維護(hù)10萬(wàn)+star 的開(kāi)源技術(shù)資源庫(kù)，包括：Python, Java, C/C++, Go, JS, CSS, Node.js, PHP, .NET 等
關(guān)注后獲取
回復(fù) 資源 獲取 10萬(wàn)+ star 開(kāi)源資源
分享、點(diǎn)贊和在看
支持我們分享更多優(yōu)秀開(kāi)源項(xiàng)目，謝謝！