Normalize.css簡介

我們在開發的時候會發現很多樣式都自帶了各自特有的默認樣式，而這樣樣式通常會被遺忘，導致樣式調整起來很繁瑣。為了讓樣式統一，我們在開發的時候通常會對一些元素進行樣式重置，已避免默認樣式影響開發。Normalize.css就是一個這樣的CSS樣式文件，它的作用就是讓HTML元素更好的實現跨瀏覽器一致性。

網址鏈接: http://necolas.github.io/normalize.css/

Normalize.css 特點

標準化的樣式，適用于大部分HTML元素；

保留有用的瀏覽器默認樣式，而不是全部樣式“重置”；

修復了瀏覽器BUG并保證瀏覽器樣式的一致性；

優化了CSS樣式提高了易用性；

獨立模塊化開發，支持樣式自定義；

支持大部分主流瀏覽器，如Chrome、Firefox、Opera 、Safari、Internet Explorer 等（包括移動瀏覽器）；

安裝Normalize.css

在Vue中安裝Normalize.css很簡單，還是老套路 ：npm install normalize.css --save，當前版本8.0.1。

normalize.css文件

在node_modules/normalize.css目錄中我們可以找到normalize.css文件，我們可以看到每個元素前面都有詳細的注釋文檔描述。Normalize支持大部分主流瀏覽器，同時對HTML5元素、排版、列表、嵌入式內容、表單和表格等都進行了規范化，是一種現代的、為HTML5準備的CSS重置替代方案。

項目中引入

在main.js中我們引入normalize.css樣式：import 'normalize.css/normalize.css'，這樣我們就可以將normalize.css作為項目的基礎CSS樣式并在此基礎上構建我們的項目，當然如果默認值不符合我們的樣式需求時我們統一可以通過自定義樣式來覆蓋默認值。

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的Vue项目实战07：引入Normalize.css样式初始化的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。