Antialias
Type:
Mixin
@include
antialias();
* You can call mixins with or without
gls-
namespace (e.g. @include gls-antialias();
).Antialias Sass mixin provides smooth font rendering which means smooth the font on the level of pixel and prevents the subpixels-rendering.
Arguments
Name | Type | Description |
---|---|---|
$value | string | Accepts |
* Please check out the links at the end of the page for more information about Font Smoothing.
Examples
If you call it in a selector with no value passed the style rules will be applied to this very element and all its children.
.element{
@include antialias;
}
//CSS Output
.element, .element:before, .element:after,
.element *,
.element *::before,
.element *::after {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
Pass the only
value as an argument to apply the style rules to only one specific HTML element.
.element{
@include antialias(only);
}
//CSS Output
.element, .element::before, .element::after {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
Call the mixin at the root of your stylesheet to target all the HTML elements.
@include antialias;
//CSS Output
*,
*::before,
*::after {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}