diff options
| -rw-r--r-- | sass.html.markdown | 19 |
1 files changed, 10 insertions, 9 deletions
diff --git a/sass.html.markdown b/sass.html.markdown index d1e0721f..9bc72478 100644 --- a/sass.html.markdown +++ b/sass.html.markdown @@ -188,7 +188,8 @@ body.noLinks a { #################### */ /* Sass provides functions that can be used to accomplish a variety of tasks. Consider the following */ - + +/* Functions can be invoked by using their name and passing in the required arguments */ body { width: round(10.25px); } @@ -207,19 +208,19 @@ body { background-color: rgba(0, 0, 0, 0.75); } -/* You may also define your own functions. Functions are very similar to mixins. When trying to choose between - a function or a mixin, remember that functions are best for returning values while mixins are best for - generating CSS while functions are better for logic that might be used throughout your Sass code. The - examples in the Math Operators' section are ideal candidates for becoming a reusable function. */ - -/* This function will take a target size and the parent size and calculate and return the percentage */ +/* You may also define your own functions. Functions are very similar to mixins. When trying + to choose between a function or a mixin, remember that functions are best for returning + values while mixins are best for generating CSS while functions are better for logic that + might be used throughout your Sass code. The examples in the Math Operators' section are + ideal candidates for becoming a reusable function. */ + +/* This function will take a target size and the parent size and calculate and return + the percentage */ @function calculate-percentage($target-size, $parent-size) { @return $target-size / $parent-size * 100%; } -/* Functions can be invoked by using their name and passing in the required arguments */ - $main-content: calculate-percentage(600px, 960px); .main-content { |