scss Sass mixin链接

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了scss Sass mixin链接相关的知识,希望对你有一定的参考价值。

@mixin linksColors-lvhaf($link, $visited, $hover, $active, $focus) {
	a { transition:.2s; padding:1%; margin:-1%; text-decoration:underline;
		&         { color:$link; }
		&:visited { color:$visited; }
		&:hover   { color:$hover; text-decoration:none; }
		&:active  { color:$active; outline:#ccc 1px dotted; }
		&:focus   { color:$focus; }
	}
}

//Usage
@include linksColors-lvhaf { blue, purple, ligthen(blue,10), orange, red; }

/* Note:
Alebit not the pretiest , the letters "lvhaf" in the name represent the order in which the pseudo-classes have to appear.

They also help remind you the order of the pseudo-classes.

1. Link
2. Visited
3. Hover
4. Active
5. Focus
*/

以上是关于scss Sass mixin链接的主要内容,如果未能解决你的问题,请参考以下文章

scss sass_vertical-ALIGN-mixin.scss

scss SASS,SCSS,mixin:PX到EM的转换

scss Mixins Sass

scss CSS Flexbox - Sass Mixins

scss 用于媒体查询的Sass mixins

scss Mixins Sass