Normalize.css的使用及下载

Normalize.css是一个很小的CSS文件,它默认的HTML元素样式上提供了跨浏览器的高度一致性,相比传统的CSS reset,Normalize.css是一种现代的、为HTML5准备的优质替代方案

Normalize.css官网地址:https://necolas.github.io/normalize.css/

下载

npm install normalize.css

使用上面命令进行下载

引入

在main.js入口文件里进行引入

import 'normalize.css'

执行以上操作,我们就可以使用Normalize.css了

Normalize.css 是什么?

Normalize.css 是一个可以定制的CSS文件,它让不同的浏览器在渲染网页元素的时候形式更统一。

 Normalize.css 能干什么?

  • 保留有用的默认值,不同于许多 CSS 的重置

  • 标准化的样式,适用范围广的元素。

  • 纠正错误和常见的浏览器的不一致性。

  • 一些细微的改进,提高了易用性。

  • 使用详细的注释来解释代码。 

Normalize.css到底有什么用

  • 不同的浏览器在对于CSS没有定义的一些样式属性是不一样的,
  • 比如没有在自己的CSS里面规定超链接有没有下划线的时候,有些浏览器有,有些浏览器没有;
  • 再比如有一些浏览器规定的超链接默认颜色是蓝色,有一些又是黑色。
  • 而这个CSS的功能就是对几乎所有的默认样式进行重置,让所有的浏览器上对于未定义的样式浏览效果达到一致(虽然说无法完全一致,但至少可以消除掉大部分差距)
  • 当然如果你自己的CSS已经对默认样式进行了重置,不使用它也是可以的。

引用中提到了下载normalize.css的方法,需要使用npm来进行下载。具体步骤如下: 1. 打开终端或命令行工具,进入项目的根目录。 2. 运行以下命令来安装必要的依赖: ``` npm install css-loader style-loader -S npm install normalize.css -S ``` 这些命令将会安装normalize.css以及相关的loader。 3. 下载完成后,你就可以在你的项目中使用normalize.css了。引用中提供了在代码中引入normalize.css的示例: ``` import &#39;normalize.css/normalize.css&#39;; import &#39;normalize.css&#39;; ``` 你可以根据实际情况选择其中一种方式来引入normalize.css。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [Vue 使用 normalize.css](https://blog.csdn.net/qq_45747519/article/details/115677104)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *2* [Vue 初始化样式之 normalize.css](https://blog.csdn.net/seimeii/article/details/126281712)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值