Stylus入门教程--实例(2)

本文是Stylus入门教程的第二部分,详细介绍了Stylus中的函数定义,包括如何返回多个值和处理哈希示例。此外,还讲解了关键字参数的使用,允许按参数名引用。内置方法如颜色处理和属性操作也被探讨,如dark()、light()、push()和unshift()等。最后,文章提到了Stylus的注释类型及其在压缩模式下的处理方式。
摘要由CSDN通过智能技术生成

1、函数(function)

Stylus强大之处就在于其内置的语言函数定义。其定义与混入(mixins)一致;却可以返回值。

  • 多个返回值
sizes = 15px 10px

sizes[0]
// => 15px
sizes()
 15px 10px

sizes()[0]
// => 15px
  • 难点:哈希示例

下面,我们定义get(hash, key)方法,用来返回key值或null. 我们遍历每个键值对,如果键值匹配,返回对应的值。

get(hash, key)
  return pair[1] if pair[0] == key for pair in hash

下面例子可以证明,语言函数模样的Stylus表达式具有更大的灵活性。

hash = (one 1) (two 2) (three 3)

get(hash, two)
// => 2

get(hash, three)
// => 3

get(hash, something)
// => null

2、关键字参数(key arguments)

Stylus支持关键字参数,或”kwargs”. 允许你根据相关参数名引用参数。

下面这些例子功能上都是一样的。但是,我们可以在列表中的任何地方放置关键字参数。其余不键入参数将适用于尚未得到满足的参数。

body {
  color: rgba(255, 200, 100, 0.5);
  color: rgba(red: 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值