本文编写于 215 天前,最后修改于 139 天前,其中某些信息可能已经过时。

一、CSS reset(样式重置)

官方QQ群

1,什么是 CSS reset?
(1)HTML 标签在浏览器中都有默认的样式,但是不同的浏览器的默认样式存在差别。
例如 ul 默认带有缩进样式,在 IE 下,它的缩进是由 margin 实现的,而在 Firefox 下却是由 padding 实现的。
(2)开发时浏览器的默认样式可能会给我们带来多浏览器兼容性问题,影响开发效率。现在很流行的解决方式是一开始就将浏览器的默认样式全部覆盖掉,从而尽可能地避免跨浏览器的差异,这就是 css reset。

body{

line-height:1.4;
color:#333;
font-family:arial;
font-size: 12px;
background:white;

}
input,textarea,select{

font-size:12px;
font-size:100%;
font-family:arial;
font-family:inherit;

}
body,h1,h2,h3,h4,h5,h6,p,ul,ol,form{

margin:0;

}
h4,h5,h6{

font-size:1em;

}
ul,ol{

padding-left:0;
list-style-type:none;

}
/image with no-border/
a img{border:0;}
img{border:0;}

2,Normalize.css 介绍
(1)Normalize.css 是一种 CSS reset 的替代方法。它在默认的 HTML 元素样式上提供了跨浏览器的高度一致性。相比于传统的 CSS reset,Normalize.css 是一种现代的、为 HTML5 准备的优质替代方案。
原文:CSS - 项目常用的通用样式汇总1(CSS reset、Normalize.css)

(2)normalize.css 的目标如下:
保护有用的浏览器默认样式,而不是完全去掉它们。
规范化各种 HTML 元素的样式。
修复浏览器自身的 bug 并保证各浏览器的一致性。
用一些小技巧优化 CSS 可用性。
使用注释和详细文档解释代码。

3,Normalize.css 的安装使用
(1)对于普通的 H5 项目,我们可以到其官网下载最新的 Normalize.css,然后在页面中引入使用。
官网地址:https://necolas.github.io/normalize.css/

(2)对于 Vue.js 项目,可以先进入项目文件夹中执行如下命令安装:

npm install --save normalize.css

(3)然后在 vue 的主文件中引入即可:

import 'normalize.css/normalize.css'

原文出自:https://www.hangge.com/blog/cache/detail_2594.html