1. Home
  2. CSS

Scss variables mixins

Code examples

8
0

sass mixin 

@mixin transform($property) {
  -webkit-transform: $property;
  -ms-transform: $property;
  transform: $property;
}
.box { @include transform(rotate(30deg)); }
2
0

scss @mixin base 

@mixin rtl($property, $ltr-value, $rtl-value) {
  #{$property}: $ltr-value;

  [dir=rtl] & {
    #{$property}: $rtl-value;
  }
}

.sidebar {
  @include rtl(float, left, right);
}
0
0

scss variables mixins 

// _base.scss
$font-stack:    Helvetica, sans-serif;
$primary-color: #333;

body {
  font: 100% $font-stack;
  color: $primary-color;
}
0
0

scss variables mixins 

// styles.scss
@use 'base';

.inverse {
  background-color: base.$primary-color;
  color: white;
}

Similar pages

Similar pages with examples

scss variables mixins
sass mixin
scss @mixin base

In other languages

This page is in other languages

Русский
..................................................................................................................
Ссылка
Italiano
..................................................................................................................
Link
Polski
..................................................................................................................
Link
Română
..................................................................................................................
Legătură
한국어
..................................................................................................................
링크
हिन्दी
..................................................................................................................
लिंक
Français
..................................................................................................................
Lien
Türk
..................................................................................................................
Atıf
Česk
..................................................................................................................
Odka
Português
..................................................................................................................
Referênci
ไทย
..................................................................................................................
เชื่อมโยง
中文
..................................................................................................................
链接
Español
..................................................................................................................
Referencia
Slovenský
..................................................................................................................
Odkaz
Балгарскі
..................................................................................................................
Спасылка
Íslensk
..................................................................................................................
Link

Popular in the category

Popular pages with examples in the category

uytutyu
span nowrap
install kite with conda
extend scss
menu berger in themyfy doesnt work
installer scss projet wordpress
dict to sql python
codemirror resizable
scp topia
gulp association of files
Galerija nije kreirana uspešno
codebuddysurej
terminal download website source code
dad
remove or hide powered by text from Google Translate
The edit queue is full at the moment - try again in a few minutes!