关于前端学习:CSS样式postcss

8次阅读

共计 412 个字符,预计需要花费 2 分钟才能阅读完成。

  • 理解 postcss
    postcss 一种对 css 编译的工具,可实现一些工程化操作
  • 环境配置

    1. 装置 node 环境
    2. 下载 postcss 模块:npm install post-cli -g
    3. 配置 postcss 配置文件

      module.exports={
         plugins:{
             'autoprefixer':{browsers:'>5%'}
         }
       }
    4. 转换文件:postcss 源文件 -o 生成文件 -w
  • 罕用的 postcss 插件

  1. Autoprefixer
    前缀补全,全自动的,无需多说
    装置:npm install Autoprefixer –dev
  2. postcss-cssnext
    应用下个版本的 css 语法
    装置:npm install postcss-cssnext –dev
  3. postcss-pxtorem
    把 px 转换成 rem
    装置:npm install postcss-pxtorem –dev
    [== 留神 ==]px 检测辨别大小写,也就是说 Px/PX/pX 不会被转换,能够用这个形式防止转换成 rem
正文完
 0