css
style-loader
css-loader
postcss
postcss-loader autoprefixer
功能: -webkit一
css
-webkit一transform:retate( -45deg)
transform: rotate( -45deg);配置
js
//postcss.config.js
module.exports = {
plugins: [require('autoprefixer')]
}normalize.css
CSS 重置的现代替代方案
https://www.npmjs.com/package/normalize.css

import 'normalize.css/normalize.css'
Windi CSS
- ⚡️速度快 - 比vue-cli-plugin- tailwind快20~100 倍
- 🧩 按需 CSS 实用程序(与 Tailwind CSS v2 兼容)和原生元素样式重置
- 🍃 加载配置
tailwind.config.js - 📄 CSS
@apply/@screen指令转换 - 🎳 支持实用程序组 - 例如
bg-gray-200 hover:(bg-gray-100 text-red-300)
init.css
css
body {
height: 100vh;
width: 100vw;
}
/**
* 适配 iphone 底部安全区(指示条,配合index.html <meta name="viewport" ... />使用
* @supports 是CSS3新引入的规则之一,主要用于检测当前浏览器是否支持某个CSS属性并加载具体样式.
*/
@supports (bottom: env(safe-area-inset-bottom)) {
body {
box-sizing: border-box;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
overflow: auto;
}
}
讨论区
欢迎留下想法与补充