非常教程

PostCSS 参考手册

PostCSS插件

图片与字体

图片与字体

  • postcss-assets 允许您简化URL,插入图像尺寸和内联文件。
  • postcss-assets-rebase从中转出资产url()
  • postcss-at2x通过使用at-2x关键字处理视网膜背景图像。
  • postcss-border-9-patch 通过自定义规则生成9个补丁类边框样式。
  • postcss-cachebuster 为图像和字体添加版本参数
  • postcss-copy-assets将亲属引用的资产复制url()到构建目录中。
  • postcss-data-packer 将嵌入式Base64数据移动到单独的文件中。
  • postcss-easysprites根据image.png #hash和纵横比(@2x)将图像组合成精灵。
  • postcss-image-set添加background-image第一张图片image-set()
  • postcss-image-inliner 内联本地和远程图像。
  • postcss-instagram添加Instagram过滤器filter
  • postcss-filter-tint 将色调过滤器添加到图像等元素。
  • postcss-font-awesome 为font-awesome unicode代码添加了一个简单的快捷方式
  • postcss-font-pack 简化字体声明并验证它们是否与配置的字体包匹配。
  • postcss-fontpath 为不同的浏览器添加字体链接。
  • postcss-lazyimagecss 自动添加图像宽度和高度。
  • postcss-lazysprite 从图像目录生成精灵。
  • postcss-placehold 可以轻松放入占位符图像。
  • postcss-resemble-image 为与原始图像松散相似的图像提供渐变回退。
  • postcss-responsive-images 添加样式表以使图像响应。
  • postcss-sprites 从样式表生成CSS sprites。
  • postcss-svg 将内联SVG插入CSS并允许管理它的颜色。
  • postcss-svg-fallback 将CSS中的SVG转换为IE 8的PNG文件。
  • postcss-svgo通过SVGO处理内联SVG 。
  • postcss-unicode-characters使unicode-range描述符更容易编写。
  • postcss-url折扣或内联url()s。
  • postcss-urlrev将MD5哈希字符串添加到url()s。
  • postcss-write-svg 在CSS中编写内联SVG。
  • postcss-inline-svg 内联SVG图像并自定义其样式。
  • webpcss 为支持WebP的浏览器添加WebP图像的URL。
PostCSS

PostCSS 是一个利用 JS 插件来对 CSS 进行转换的工具

PostCSS 目录

1.快速上手
2.PostCSS插件指南
3.PostCSS runner指南
4.编写自定义语法
5.PostCSS插件
6.PostCSS和源地图