Sass函数(二)

本文详细介绍了Sass中的颜色函数,包括hsl()、hsla()、hue()、ie_hex_str()等,以及它们的参数和返回值。通过这些函数,开发者可以方便地进行颜色操作和转换。
摘要由CSDN通过智能技术生成

hsl($hue, $saturation, $lightness)
根据色调,饱和度和亮度值创建颜色。使用CSS3规范中的算法。

参数:

$ hue(Number) - 颜色的色调。应该在0到360度之间,包括在内
$ saturation(Number) - 颜色的饱和度。必须介于0%和100%之间,包括0和100%
$ lightness(Number) - 颜色的亮度。必须介于0%和100%之间,包括0和100% 

返回:

(Color) 

hsla($hue, $saturation, $lightness, $alpha)
根据色调,饱和度,亮度和Alpha值创建颜色。使用CSS3规范中的算法。

参数:

$ hue(Number) - 颜色的色调。应该在0到360度之间,包括在内
$ saturation(Number) - 颜色的饱和度。必须介于0%和100%之间,包括0和100%
$ lightness(Number) - 颜色的亮度。必须介于0%和100%之间,包括0和100%
$ alpha(Number) - 颜色的不透明度。必须介于0和1之间,包括0和1 

返回:

(Color) 

hue($color)
返回颜色的色相分量。请参阅CSS3 HSL规范。在必要时通过该算法从RGB计算。

参数:

$color (Color) 

返回:

(Number) - 色调成分,介于0deg和360deg之间 

ie_hex_str($color)

将颜色转换为IE筛选器可理解的格式。
例子:

ie-hex-str(#abc) => #FFAABBCC
ie-hex-str(#3322BB) => #FF3322BB
ie-hex-str(rgba(0, 255, 0, 0.5)) => #8000FF00

参数:

$color (Color) 

返回:

(String) - 颜色的IE格式的字符串表示形式 

if($condition, $if-true, $if-false)

根据是否$condition为真返回两个值中的一个。就像在@if,比其他所有的值false和null被认为是真的。
例子:
if(true, 1px, 2px) => 1px
if(false, 1px, 2px) => 2px

参数:

$ condition(Base) - 是否返回$ if-true或$ if-false
$ if-true(Tree :: Node)
$ if-false(Tree :: Node) 

返回:

(Base) — $if-true or $if-false 

index($list, $value)
返回列表中某个值的位置。如果找不到该值,则返回null。
请注意,与某些语言不同,Sass列表中的第一项是数字1,第二个数字是2,依此类推。
这可以返回地图中一对的位置。
例子:

index(1px solid red, solid) => 2
index(1px solid red, dashed) => null
index((width: 10px, height: 20px), (height 20px)) => 2

参数:

$list (Base)
$value (Base) 

返回:

(Number,Null) - $ list中从$ 1开始的索引,或者为null 

inspect($value)
返回一个包含该值的字符串作为其Sass表示。

参数:

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值