Sublime Text 3 上的自动缩进 - “键绑定” - CSS

在编程中，缩进是非常重要的标记，有助于程序员更好地组织和理解代码。Sublime Text 3 是一款流行的文本编辑器，它提供了自动缩进的功能，可以帮助程序员更快速和准确地编写代码。

开启自动缩进功能

要开启自动缩进功能，需要在 Sublime Text 3 的设置中添加一些设置。在菜单栏中选择“Preferences” -> “Settings”，会打开一个新窗口，其中包含默认设置和用户设置。

在用户设置中添加以下代码片段（如果没有则创建一个）：

{
    "auto_indent": true,
    "smart_indent": true,
    "indent_to_bracket": true,
    "indent_with_tabs": false,
    "tab_size": 4,
    "translate_tabs_to_spaces": true,
    "trim_automatic_white_space": true
}

这些设置中，“auto_indent”和“smart_indent”开启自动缩进和智能缩进功能，使得代码更加易读和清晰，“indent_to_bracket”设置将缩进到包含当前行的最近的大括号，否则将缩进到上一行所在的缩进级别，这也是一个关键的设置。

定义键绑定

Sublime Text 3 还允许程序员自定义键绑定，以便更好地操作文本编辑器。例如，可以定义按键或组合键来执行一些常用操作。下面是一些常用的键绑定，可以在 CSS 文件中使用。

打开 CSS 命名补全

当您在编写 CSS 代码时，您可以通过按下“Tab”键来打开 CSS 命名补全列表。以下是打开 CSS 命名补全的键绑定：

{ "keys": ["tab"], "command": "auto_complete", "args": {"auto_complete_selector": "source.css"} }

选择当前 CSS 属性

按下“Ctrl+Shift+A”键组合可以选择当前 CSS 属性。这对于快速编辑和删除属性非常有用。

{ "keys": ["ctrl+shift+a"], "command": "expand_selection", "args": {"to": "scope"} }

为 CSS 属性添加或删除 !important 标记

通过按下“Ctrl+Shift+F10”键组合，可以在 CSS 属性中添加或删除 !important 标记。这在修改样式时非常有用。

{ "keys": ["ctrl+shift+f10"], "command": "toggle_setting", "args": {"setting": "css_trailing_semicolon"}, "context":
        [
            { "key": "selector", "operator": "equal", "operand": "meta.property-list.css", "match_all": true },
            { "key": "preceding_text", "operator": "regex_match", "operand": "(.*;(\\s*))?(!\\s*important)?(\\s*)$", "match_all": true },
            { "key": "following_text", "operator": "regex_match", "operand": "^(\\s*)(;*)", "match_all": true }
        ]
}

结束语

通过启用自动缩进和自定义键绑定，Sublime Text 3 可以提高程序员的效率和生产力。希望这篇文章对您有所帮助，祝您编写干净、优雅的 CSS 代码！