Atom飞行手册翻译: 3.6 图标

图标

Atom自带了Octicons的图标集。使用它们来添加图标到你的包中。

使用方法

Octicons在Atom中的使用方法不同于标准用法。最大的不同是图标class的名字。你应该使用更加通用的icon icon-前缀,而不是octicon octicon-前缀。

例如,要想添加monitor图标,在你的标记中使用icon icon-device-desktop class:

<span class="icon icon-device-desktop"></span>

或者你可以像这样使用SpacePen

@span class: 'icon icon-device-desktop'

尺寸

Octicons在16pxfont-size下最美观。通常条件下就是这样使用的,所以你不用担心。如果你更喜欢不同的图标尺寸,尝试使用16的倍数(比如32px或者48px)来显示得更清晰。在此之间的尺寸也可以,但可能对于一些带直线的图标会显示得很模糊。

易用性

虽然图标会让你的UI更具有视觉感,不和文本标签一起使用的时候,就很难猜出它的意思。对于空间不足以放下文本标签的情况,考虑放置一个鼠标覆盖时显示的提示框。或者一个更巧妙的title="label"属性也会有所帮助。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值