Upgrade to Pro — share decks privately, control downloads, hide ads and more …

CSSfmt

 CSSfmt

at HTML5 Beginners 12th

Masaaki Morishita

August 27, 2015
Tweet

More Decks by Masaaki Morishita

Other Decks in Programming

Transcript

  1. //mixin for clearfix @mixin clearfix () { &:before, &:after {

    content:" "; display : table; } &:after {clear: both;} }.class { padding:10px;@include clearfix();} //placeholder %base { padding: 12px }.bar { @extend %base; }
  2. // mixin for clearfix @mixin clearfix () { &:before, &:after

    { content: " "; display: table; } &:after { clear: both; } } .class { padding: 10px; @include clearfix(); } // placeholder %base { padding: 12px; } .bar { @extend %base; }
  3. in#Command#line $ cssfmt --help Usage: cssfmt [options] input-file [output-file] Options:

    -d, --diff output diff against original file -R, --recursive format files recursively -V, --versions output the version number -h, --help output usage information
  4. gulp%cssfmt var gulp = require('gulp'); var cssfmt = require('gulp-cssfmt'); gulp.task('cssfmt',

    function () { return gulp.src('src/style.css') .pipe(cssfmt()) .pipe(gulp.dest('dist')); });