sublime如何格式化html

Sublime Text是一款非常流行的文本编辑器,它支持多种编程语言和文件格式,在Web开发中,HTML、CSS和JavaScript是最常用的技术,为了提高代码的可读性和一致性,我们需要对代码进行格式化,本文将详细介绍如何在Sublime Text中格式化HTML代码。

1、安装插件

我们需要安装一个名为“HTMLCSSJS Prettify”的插件,这个插件可以帮助我们自动格式化HTML、CSS和JavaScript代码,打开Sublime Text,点击菜单栏的“Preferences”(首选项),然后选择“Package Control”(包控制)。

2、安装插件

在“Package Control”面板中,找到并点击“Install Package”(安装包)按钮,在搜索框中输入“HTMLCSSJS Prettify”,找到对应的插件并点击安装,等待插件安装完成后,重启Sublime Text。

3、配置插件

为了使用这个插件,我们需要对其进行一些配置,点击菜单栏的“Preferences”(首选项),然后选择“Settings”(设置),在设置文件中,添加以下内容:

{
    "html_format_options": {
        "indent_inner_html": true,
        "indent_scripts": "normal",
        "indent_headings": "normal",
        "indent_char": " ",
        "unformatted": ["a", "b", "i", "em", "strong", "h1", "h2", "h3", "h4", "h5", "h6", "pre", "code"],
        "end_with_newline": false,
        "compact_empty_elements": false,
        "remove_trailing_commas": false,
        "remove_quotes": false,
        "keep_array_indentation": false,
        "break_chained_methods": false,
        "sort_attributes": false,
        "sort_default": true,
        "space_before_conditional": true,
        "unescape_strings": false,
        "jsx_single_quote": false,
        "jsx_double_quote": false,
        "jsx_angle_brackets": false,
        "jsx_self_closing": false,
        "jsx_wrap_attributes": "force",
        "space_before_function_paren": {
            "name": "none",
            "arguments": "none",
            "arrow": "ignore",
            "other": "force"
        },
        "space_after_anonymous_function": {
            "name": "none",
            "arguments": "none",
            "arrow": "ignore",
            "other": "force"
        },
        "space_before_blocks": true,
        "space_before_functions": true,
        "space_before_return": true,
        "space_before_switch": true,
        "space_before_throw": true,
        "space_before_try": true,
        "braces": {
            "style": "all",
            "color": "#000000",
            "padding": 1,
            "spacing": 1,
            "smart": true,
            "expand": true,
            "collapse": true,
            "horizontal": false,
            "vertical": false,
            "around": false,
            "align": false,
            "autowrap": false,
            "mirror": false,
            "lint": false,
            "strict": false,
            "warnings": false,
            "jsx_braces": false,
            "arrows": false,
            "liveedit": false,
            "positioning": false,
            "background": false,
            "foreground": false,
            "gutters": false,
            "draw_borders": false,
            "minimap": false,
            "classic": false,
            "css": false,
            "html": false,
            "contextmenu": false,
            "matchbrackets": true,
            "mode": null,
            "theme": null,
            "folding": false,
            "lineups": true,
            "breakable": true,
            "interlaced": true,
            "strictures": [],
            "domains": [],
            "firstline": 0,
            "lastline": Infinity,
            "safeguard: all"]}
    }
}

4、格式化HTML代码

现在,我们可以使用快捷键Ctrl+Alt+J(Windows/Linux)或Cmd+Alt+J(Mac)来格式化HTML代码了,如果你想要自定义快捷键,可以在设置文件中修改keybindings部分,将[{"keys":"ctrl+alt+j","command":"run_macro_file","args":"format html"},{"keys":"f9","command":"run_macro_file","args":"format html"},{"keys":"ctrl+shift+i","command":"toggle_comment"},{"keys":"ctrl+q","command":"exit"},{"keys":"ctrl+shift+/","command":"comment"},{"keys":"ctrl+shift+u","command":"uncomment"},{"keys":"ctrl+d","command":"delete_word"},{"keys":"ctrl+k","command":"kill_ring_save"},{"keys":"ctrl+t","command":"show_overlay"},{"keys":"ctrl+shift+n","command":"goto_definition"},{"keys":"ctrl+shift+f","command":"find"},{"keys":"ctrl+shift+r","command":"rename"},{"keys":"ctrl+shift+o","command":"show_overlay"},{"keys":"ctrl+shift+p","command":"goto_package"},{"keys":"ctrl+shift+m","command":"show_overlay"},{"keys":"ctrl+shift+/","command":"toggle_comment"},{"keys":"ctrl+shift+u","command":"uncomment"},{"keys":"ctrl+shift+c","command":"copy"},{"keys":"ctrl+shift+v","command":"paste"},{"keys":"ctrl+shift+x","command":"cut"},{"keys":"ctrl+shift+z","command":"undo"},{"keys":"ctrl+y","command":"redo"},{"keys":"ctrl+shift+l","command":"fold"},{"keys":"ctrl+shift+"}]"中的format html替换为你想要的快捷键。

分享题目:sublime如何格式化html
URL地址:http://www.hantingmc.com/qtweb/news25/423075.html

网站建设、网络推广公司-创新互联,是专注品牌与效果的网站制作,网络营销seo公司;服务项目有等

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联