官方API
rucksackcss請點擊鏈接查看
安裝
const gulp = require('gulp');
const postcss = require('gulp-postcss');
const rucksack = require('rucksack-css');
gulp.task('rucksack', () => {
return gulp.src('src/*.css')
.pipe(postcss([ rucksack() ]))
.pipe(gulp.dest('dist'));
});
神奇的功能
- 定位
position: relative 20% auto;
- 清除浮動
clear: fix;
- 字體文件路徑
@font-face {
font-path: '/my/font/file';
}
- 十六進制GRBA
color: rgba(#fff, 0.8);
-別名配置
@alias {
d:display;
o:opcity;
va:vertical-align,;
p:position;
t:top;
b:bottom;
l:left;
r:right;
f:float;
w:weight;
h:height;
mx:min-width;
mh:min-height;
xw:max-width;
xh:max-height;
lh:line-height;
m:margin;
mt:margin-top;
mb:margin-bottom;
mr:margin-right;
ml:margin-left;
p:padding;
pt:padding-top;
pb:padding-bottom;
pr:padding-right;
pl:padding-left;
o:overflow;
ox:overflow-x;
oy:overflow-y;
c:clear;
b:border;
bt:border-top;
bb:border-bottom;
br:border-right;
bl:border-left;
bgc: background-color;
bgm: background-image;
bgs: background-size;
bgp: background-position;
bgr: background-repeat;
f:font;
fs:font-size;
fw:font-weight;
}
