添加 CSS 重置
此项目设置使用 PostCSS 规范化 添加 CSS 重置。
¥This project setup uses PostCSS Normalize for adding a CSS Reset.
要开始使用它,请在你的 CSS 文件中的任意位置添加 @import-normalize;
。你只需要包含一次,重复的导入会自动删除。因为你只需要包含它一次,所以添加它的好地方是 index.css
或 App.css
。
¥To start using it, add @import-normalize;
anywhere in your CSS file(s). You only need to include it once and duplicate imports are automatically removed. Since you only need to include it once, a good place to add it is index.css
or App.css
.
index.css
@import-normalize; /* bring in normalize.css styles */
/* rest of app styles */
提示:如果你在 VSCode 中看到 "规则未知 @import-normalize css(unknownAtRules)" 警告,请将
css.lint.unknownAtRules
设置更改为ignore
。¥Tip: If you see an "Unknown at rule @import-normalize css(unknownAtRules)" warning in VSCode, change the
css.lint.unknownAtRules
setting toignore
.
你可以通过项目的 browserslist 控制使用 normalize.css 的哪些部分。
¥You can control which parts of normalize.css to use via your project's browserslist.
browserslist 为 last 3 versions
时的结果:
¥Results when browserslist is last 3 versions
:
/**
* Add the correct display in IE 9-.
*/
audio,
video {
display: inline-block;
}
/**
* Remove the border on images inside links in IE 10-.
*/
img {
border-style: none;
}
browserslist 为 last 2 versions
时的结果:
¥Results when browserslist is last 2 versions
:
/**
* Remove the border on images inside links in IE 10-.
*/
img {
border-style: none;
}
浏览器支持
¥Browser support
浏览器支持由 normalize.css 支持 决定。在撰写本文时,它包括:
¥Browser support is dictated by what normalize.css supports. As of this writing, it includes:
Chrome (last 3)
Edge (last 3)
Firefox (last 3)
Firefox ESR
Opera (last 3)
Safari (last 3)
iOS Safari (last 2)
Internet Explorer 9+