mirror of
https://github.com/danog/sass-site.git
synced 2025-01-21 21:31:34 +01:00
Remove duplicate section about mixins (#337)
This commit is contained in:
parent
6729c6fb54
commit
a41d9df7ef
@ -400,38 +400,4 @@ introduction: >
|
||||
let us do something like take pixel values and convert them to percentages
|
||||
without much hassle.
|
||||
|
||||
## Mixins
|
||||
|
||||
Some things in CSS are a bit tedious to write, especially with CSS3 and
|
||||
the many vendor prefixes that exist. A mixin lets you make groups of CSS
|
||||
declarations that you want to reuse throughout your site. You can even
|
||||
pass in values to make your mixin more flexible. A good use of a mixin is
|
||||
for vendor prefixes. Here's an example for <code>transform</code>.
|
||||
|
||||
- example do
|
||||
:plain
|
||||
@mixin transform($property) {
|
||||
-webkit-transform: $property;
|
||||
-ms-transform: $property;
|
||||
transform: $property;
|
||||
}
|
||||
|
||||
.box { @include transform(rotate(30deg)); }
|
||||
===
|
||||
=transform($property)
|
||||
-webkit-transform: $property
|
||||
-ms-transform: $property
|
||||
transform: $property
|
||||
|
||||
.box
|
||||
+transform(rotate(30deg))
|
||||
|
||||
:markdown
|
||||
To create a mixin you use the <code>@mixin</code> directive and give it a
|
||||
name. We've named our mixin <code>transform</code>. We're also using
|
||||
the variable <code>$property</code> inside the parentheses so we can pass in
|
||||
a transform of whatever we want. After you create your mixin, you can then
|
||||
use it as a CSS declaration starting with <code>@include</code> followed
|
||||
by the name of the mixin.
|
||||
|
||||
---
|
||||
|
Loading…
x
Reference in New Issue
Block a user