Sass mixins example

Sass Mixins:

A mixin is as like function you can give the name as you wish as: I have given “bordRadi” name. And I called using with @include “mixin name”.

@mixin bordRadi($radius) {
  -webkit-border-radius: $radius;
  -moz-border-radius: $radius;
    -ms-border-radius: $radius;
        border-radius: $radius;
.box { @include bordRadi(10px); border:1px solid #ddd; }

After Compiled code: 
.box {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
  border: 1px solid #ddd; }

No comments:

Note: Only a member of this blog may post a comment.

Copyright Reserved to Anything Learn. Powered by Blogger.