信息发布→ 登录 注册 退出

在vscode中快速新建html文件的2种方法总结

发布时间:2026-01-11

点击量:
目录
  • 在vscode中新建html文件的两种方法:
    • 第一个方法:
    • 第二个方法:
  • 补充:想要快速打开HTML文件查看编辑效果
    • 总结 

      在vscode中新建html文件的两种方法:

      第一个方法:

      1 点击菜单【文件】,如图所示。

      2 点击【新建文件】,如图所示。

      3 就会创建一个没有命名的文件,如图所示。

      4 点击选择语言开始,会弹出选择语言模式,在自动检测的下拉菜单中选择html,一个没有命名的html文件就创建好了。

      5 点击保存或者另存为,给没有命名的html起个名字,可以起字母,数字,中文,起好名字,点击保存,一个html文件就创建好了。

      6 我们在html文件上输入【!】叹号(在英文状态下),然后按键盘的【Tab】键,只有在这种情况下按住Tab键才有用,如图所示。

      7 按住tab键后,系统生成的html文件,如图所示。

      第二个方法:

      1 点击菜单【文件】,如图所示。

      2 点击【新建文件】,或者使用快捷键ctrl+n,如图所示

      3 点击完【文件】然后点击【保存】或者按快捷键【ctrl+s】进入保存界面,也可以点击另存为或者按快捷键【ctrl+shift+s】我们【输入html文件名称】,选择html的后缀【html】,最后点击保存,如图所示。

      4 我们在html文件上输入【!】叹号(在英文状态下),然后按键盘的【Tab】键,只有在这种情况下按住Tab键才有用,如图所示。

      5 按住tab键后,系统生成的html文件,如图所示。

      补充:想要快速打开HTML文件查看编辑效果

      1.点击编辑器主界面左上侧第五个小图标——‘扩展’按钮;

      2.搜索 open in browser

      3.打开 xxx.html 文件,右键选择“Open In Default Browser”或者快捷键 alt+B 直接运行

      总结 

      在线客服
      服务热线

      服务热线

      4008888355

      微信咨询
      二维码
      返回顶部
      ×二维码

      截屏,微信识别二维码

      打开微信

      微信号已复制,请打开微信添加咨询详情!