图标

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

易用性

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

Atom飞行手册翻译： 3.6 图标相关推荐

Atom飞行手册翻译： 2.12 在Atom中写作
在Atom中写作虽然Atom通常可能用来编写软件的代码,但是它还可以用来高效地编写文章.这通常采用一些标记语言,比如说Markdown和Asciidoc(也就是英文手册所用的格式)来完成.下面我们会 ...
Atom飞行手册翻译： 2.11 Atom中的版本控制
Atom中的版本控制对于任何项目来说,版本控制都是很重要的一个方面.Atom集成了一些基本的Git和Github功能. 检出(checkout)HEAD中的版本 cmd-alt-Z快捷键检出当前文件 ...
Atom飞行手册翻译： 3.7 调试
调试 Atom拱了一些工具来帮助你理解预料之外的行为和调试问题.这篇指南介绍了一些工具和方法用于帮助你调试,以及提供了一些提交工单(issue)时的帮助信息. 升级到最新版本你可能遇到了在最新版本已 ...
Atom飞行手册翻译： 2.7 ~ 2.10
自动补全如果你仍旧希望节约一些打字时间,Atom自带简单的自动补全功能. 通过使用ctrl-space,自动补全工具可以让你看到并插入可选的完整单词. 通常,自动补全工具会浏览当前打开的整个文档,寻 ...
Atom飞行手册翻译： 3.4 文本处理包
文本处理包在我们写完第一个包之后,让我们看一看我们能写出来的其它包的例子.这一节会引导你创建一个简单的命令来将选中的文字替换为字符画(ascii art).在你在单词"cool" ...
Atom飞行手册翻译： 4.2 深入键表（keymap）
深入键表(keymap) 键表文件是以JSON或者CSON编码的文件,其中含有嵌套的哈希表.它们的工作方式像是样式表,但是它们指定匹配选择器的元素的快捷键的作用,而不是应用样式属性.下面是一些快捷键的 ...
Atom飞行手册翻译： 4.5 ~ 4.8
开发Node模块 Atom中的一些包是Node模块,而不是Atom的包.如果你想要修改这些Node模块,例如atom-keymap,你需要把它们链接到不同于普通Atom包的开发环境中. 把Node模块 ...
Atom飞行手册翻译： 4.3 作用域设置、作用域和作用域描述符
作用域设置.作用域和作用域描述符 Atom支持语言特定的设置.你可以在Markdown文件中软换行,或者在Python中把tab的宽度设置为4. 语言特定的设置只是一些东西的子集,我们把它叫做&quo ...
Atom飞行手册翻译： 4.4 Atom中的序列化
Atom中的序列化当一个窗口被刷新,或者从上一次会话恢复的时候,视图和它相关的对象会从JSON表达式中反序列化,它们在窗口上一次关闭时储存.要使你自己的视图和对象兼容刷新,你需要让它们很好地执行序列 ...

Atom飞行手册翻译： 3.6 图标

图标

使用方法

尺寸

易用性

Atom飞行手册翻译： 3.6 图标相关推荐

最新文章

热门文章