pandao / prefixes.scss

CSS(3) prefixes mixins for Sass/Scss

Prefixes.scss

CSS(3) prefixes mixins library for Sass/Scss, Custom you need CSS prefixes.

Install

NPM install:

bower install prefixes.scss --save-dev

Bower install :

bower install prefixes.scss

Download :

• zip
• prefixes.scss

Example

Scss:

@import "prefixes";
    
.example {
    @include clearfix();
    @include border-radius(4px);
    @include box-shadow(0 1px 5px rgba(0, 0, 0, .5));
}

Sass:

@import "../prefixes"

.example
    @include clearfix()
    @include border-radius(4px)
    @include box-shadow(0 1px 5px rgba(0, 0, 0, .5))

CSS:

.example {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
    -ms-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
    -o-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5); 
}
    
.example:before, .example:after {
    content: " ";
    display: table; 
}
    
.example:after {
    clear: both; 
}

Changes

Change logs

References

• CanIUse
• Should I Prefix
• MDN CSS Reference
  • Mozilla Extensions
  • Webkit Extensions
• CtripUED -webkit CSS lib
• Vendor-prefixed CSS Property Overview

License

The MIT license.

Copyright (c) 2015 - 2018 Pandao