HSL Functions
hsl($hue, $saturation, $lightness)
Converts an
hsl(hue, saturation, lightness) triplet into a color.//色相、飽和度、亮度
hsla($hue, $saturation, $lightness, $alpha)
Converts an
hsla(hue, saturation, lightness, alpha) quadruplet into a color.//色相、飽和度、亮度、透明度
hue($color)
Gets the hue component of a color.//擷取顏色的色相
saturation($color)
Gets the saturation component of a color.//擷取顏色的飽和度
lightness($color)
Gets the lightness component of a color.//擷取顏色的亮度
adjust-hue($color, $degrees)
Changes the hue of a color.//調整色相
lighten($color, $amount)
Makes a color lighter.
darken($color, $amount)
Makes a color darker.
saturate($color, $amount)
Makes a color more saturated.
desaturate($color, $amount)
Makes a color less saturated.
grayscale($color)
Converts a color to grayscale.//灰階
complement($color)
Returns the complement of a color.//互補
invert($color)
Returns the inverse of a color.//反相
sass:
color: lighten(#8ec63f, 50%)color: darken(#8ec63f, 30%)color: saturate(#8ec63f, 75%)color: desaturate(#8ec63f, 25%)color: adjust-hue(#8ec63f, 30)color: adjust-hue(#8ec63f, -30)color: fade-in(rgba(142, 198, 63, 0), .4)color: fade-out(#8ec63f, .4)
color: invert(#8ec63f)color: complement(#8ec63f)color: mix(#8ec63f, #fff)color: mix(#8ec63f, #fff, 10%)color: grayscale(#8ec63f)
編譯後css:
color: white;color: #3b5319;color: #98ff06;color: #89a75e;color: #4ac63f;color: #c6bb3f;color: rgba(142, 198, 63, 0.4);color: rgba(142, 198, 63, 0.6);
color: #7139c0;color: #773fc6;color: #c6e29f;color: #f3f9eb;color: #838383;
Miscellaneous FunctionsNew Sass functions can be added by adding Ruby methods to this module. For example:
module Sass::Script::Functions def reverse(string) assert_type string, :String Sass::Script::String.new(string.value.reverse) end declare :reverse, :args => [:string]end
Calling declare tells Sass the argument names for your
function. If omitted, the function will still work, but will not be able to accept keyword arguments. declare can
also allow your function to take arbitrary keyword arguments.
There are a few things to keep in mind when modifying this module. First of all, the arguments passed are Sass::Script::Literal objects.
Literal objects are also expected to be returned. This means that Ruby values must be unwrapped and wrapped.
Most Literal objects support the value accessor for getting
their Ruby values. Color objects, though, must be accessed using rgb, red, green,
or blue.
Second, making Ruby functions accessible from Sass introduces the temptation to do things like database access within stylesheets. This is generally a bad idea; since Sass files are by default only compiled once, dynamic code is not a great fit.
If you really, really need to compile Sass on each request, first make sure you have adequate caching set up. Then you can use Sass::Engine to
render the code, using the options parameterto pass in data that can
be accessed from your Sass functions.
Within one of the functions in this module, methods of EvaluationContext can
be used.
CaveatsWhen creating new Literal objects within functions, be aware that it’s not safe to call #to_s (or
other methods that use the string representation) on those objects without first setting the
#options attribute.
給出最全的:http://sass-lang.com/docs/yardoc/Sass/Script/Functions.html