特级高清无码电影,亚洲国产成人欧美在线观看,亚洲精久久久久久无码

本文和大家分享的主要是使用PostCSS 自動添加 CSS3 屬性前綴相關內容，一起來看看吧，希望對待學習CSS3有所幫助。

　　PostCSS 是通過 JS 插件轉化 CSS 樣式的一個庫，這種轉化包括但不限于檢查 CSS 語法、使用變量和 mixins 、將 CSS 語法轉化為瀏覽器兼容模式（比如常用的添加瀏覽器廠商前綴）等等。

　　盡管PostCSS 可以當做 CSS 預處理器來使用，就像 SASS 和 LESS 一樣，但 PostCSS 能做的遠不止如此，因為 PostCSS 的功能是可以通過插件進行擴展的。

　　目前而言，PostCSS 最吸引我的是因為它可以提供 SASS 和 LESS 不能（輕易）完成的功能：給 CSS3 屬性添加瀏覽器廠商前綴，轉化 Flex 布局使其兼容 IE10 以下瀏覽器。

　　如果你習慣使用SASS 語法，同時又想使用 PostCSS 給 CSS3 屬性添加前綴，也是可以做到的，這也是本篇文章重點介紹的。

　　如何使用

　　目前流行的使用方式是通過Gulp 或者 Webpack 使用。

　　通過Gulp使用

　　· 簡單使用

　　先貼出通過使用 flexibility 插件，轉換Flex 語法兼容 IE10 以下瀏覽器的 gulpfile.js 文件內容：

　　 const gulp = require('gulp');

　　// 引入 PostCSS const postcss = require('gulp-postcss');

　　/**

　　* 通過 require 引入 PostCSS 所需插件，這里除了引入 flexibility

　　gulp.task('css', function (){

　　 return gulp.src('src/main.css')

　　.pipe( postcss([ require('postcss-flexibility') ]) )

　　.pipe( gulp.dest('dist/') );

　　});

　　通過 postcss([ require('postcss-flexibility') ]) 便可以引入 postcss-flexibility 插件對CSS 進行處理了。其中插件列表是一個數組，可以引入多個，比如還想給 CSS3 屬性添加前綴可以這樣寫：

　　 ...

　　.pipe( postcss([ require('postcss-flexibility'), require('autoprefixer') ]) ) ...

　　插件使用前需要先通過npm 進行安裝。

　　· 結合 SASS 使用

　　如果已經習慣使用SASS 語法寫 CSS ， PostCSS 也可以處理經過 SASS 轉化后的 CSS 文件， gulpfile.js 文件配置如下（這里也引入了添加 CSS3 屬性前綴的插件）：

　　 const gulp = require('gulp');

　　// 引入 PostCSS const postcss = require('gulp-postcss');

　　// 引入 SASS const sass = require('gulp-sass');

　　/**

　　* 通過 require 引入 PostCSS 所需插件，這里除了引入 flexibility, autoprefixer 插件

　　gulp.task('css', function (){

　　 return gulp.src('src/main.css')

　　.pipe( sass() )

　　.pipe( postcss([ require('postcss-flexibility'), require('autoprefixer') ]) )

　　.pipe( gulp.dest('dist/') );

　　});

來源：Vince

99热99这里只有精品6国产,亚洲中文字幕在线天天更新,在线观看亚洲精品国产福利片 ,久久久久综合网