VsCode运行html界面的实战步骤

目录
  • 前言
  • 1、安装插件open in browser的步骤
  • 2、总结

前言

一般我们安装VSCode需要安装很多插件，在VSCode中默认编写的HTML页面是不能运行的。

新手在使用VSCode会遇到类似这种问题：鼠标右键后并没有找到 "Open in default brower" 。

这时我们需要安装一个插件open in browser：

1、安装插件open in browser的步骤

1、打开vscode软件→点击左侧第五个图标→搜索open in brower→下载，如下图所示

 2、在html页面右键单击，选择Open in default browse即可，如下图所示 

2、总结

1，打开VSCode软件，编写一个HTML页面

2，点击左侧的第五个图标

3，搜索open in browser，点击进入

4，点击install（安装）按钮

5，在html页面右键单击，选择open in default browse

6，也可以选择open in other browse，自己选择浏览器即可

到此这篇关于VsCode运行html界面的文章就介绍到这了,更多相关VsCode运行html界面内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • vscode怎么编译运行

    vscode 的调试功能其实提供了一键编译运行的功能(ctrl+F5),但是启动特别特别慢- 又不想安装插件,后来发现vscode 提供了一个叫做 Task 的功能,下面我就来介绍一下怎么使用Task功能实现C\C++的一键编译运行(Linux平台下,windows下自行修改).python, java以及其他语言都可以稍加修改实现类似的功能. 第一步:新建一个Task ctrl+shift+P启动全局控制台,输入configure task 选择使用模板创建task.json文件 之后选择最后

  • 如何使用VSCode 运行调试插件代码

    VSCode 运行插件,现在我们对这个插件的实现方式和注册方式已经有了了解,下面就到了运行和调试代码的时候了.VS Code 的插件代码脚手架已经为我们提供了 launch.json ,所以我们只需要按下 F5 即可启动代码. 代码启动后,VS Code 会打开一个新的窗口,这个窗口中就运行着我们本地书写的代码.此时我们打开命令面板,搜索 "Hello World" 并且执行. 上面我提到了,这个插件只有在 "Hello World" 命令被执行时才会被激活.那下面

  • VSCode配置C#运行环境的完整步骤

    VSCode配置C#运行环境的完整步骤

    前言 最近在学c#,运行环境一般都是在vs中,但是想单纯的写一些短的测试代码还是习惯使用vscode,记录一下配置过程. VSCode配置C#运行环境 1. 下载 dotnet-sdk 下载地址:https://dotnet.microsoft.com/learn/dotnet/hello-world-tutorial/install 懒得去官网下载可以直接拿我下载好的,放在了百度网盘,需要可自行下载 链接: https://pan.baidu.com/s/144WwujY2PIwy3esYx7

  • 如何通过vscode运行调试javascript代码

    初次正式要写 javascript 相关的代码,想要用 vscode 直接编译 js 代码,但是发现没有那么简单,需要配置好 launch.json 文件,现已经在vscode上编译过去并且可以调试 javascript 代码,总结了两种方法,分享给大家. 方法一: 在 js 后缀文件中写 javascript 代码. 1. 环境配置: (1). 需要安装 nodejs (在Bing搜索中输入 nodejs, 找到nodejs官网,然后找到适合你电脑配置的安装包进行下载安装,最后要输入 node

  • VsCode运行html界面的实战步骤

    VsCode运行html界面的实战步骤

    目录 前言 1.安装插件open in browser的步骤 2.总结 前言 一般我们安装VSCode需要安装很多插件,在VSCode中默认编写的HTML页面是不能运行的. 新手在使用VSCode会遇到类似这种问题:鼠标右键后并没有找到 "Open in default brower" . 这时我们需要安装一个插件open in browser: 1.安装插件open in browser的步骤 1.打开vscode软件→点击左侧第五个图标→搜索open in brower→下载,如下

  • VSCode配置C++环境的方法步骤（MSVC）

     最近心血来潮,想用一下微软的VSCode写一下C++,然而第一步就卡住了,竟然不会配置C++环境,陆陆续续搞了两天,总算是弄明白了,网上msvc教程比较少,就打算分享出来,也记录下自己的历程.  先说说我的理解吧,Visual Studio Code和visual studio不同,后者是属于IDE是个集成开发环境,下载好基本就能直接用来写C++等:  而Visual Studio Code(以下简称VSC)是一个编辑器,简单来说和windows电脑上的那个看.txt文件的记事本一个类别,然而

  • VSCODE调试RDKit内核的方法步骤(C++)

    VSCODE调试RDKit内核的方法步骤(C++)

    目录 安装 RDKit 所需环境 配置 VSCode 使其能 Debug 配置 Intellisense 配置 CMake 新建调试文件进行调试 Anaconda 环境问题 参考资料 在研究 RDKit 的一些算法的时候,总希望能够"进入到代码中"看这些变量到底是什么,哪些代码块会被执行.可 RDKit 的编译比较复杂,如果是 Python 的部分,那么可以直接在 VSCode 中进行调试,记得在 launch 中设置 "justMyCode: false",详见该

  • VSCode创建Vue项目的完整步骤教程

    VSCode创建Vue项目的完整步骤教程

    目录 一.配置环境 1.安装VS Code 2.安装node.js 3.安装配置脚手架vue-cli 二.创建vue项目 1.命令方式创建 2.重新初始化依赖 3.启动项目 补充:在VScode中如何使用vue代码 总结 一.配置环境 1.安装VS Code 官网下载 https://code.visualstudio.com/ 下载VS Code,按照步骤安装. 2.安装node.js (1)官网 https://nodejs.org/en/ 下载node.js,按照步骤安装即可,node.j

  • Pycharm如何运行.py文件的方法步骤

    Pycharm时一个非常好用的IDE,但是一开始的时候甚至会因为.py文件不能运行而束手无策... 这里需要说明一下Pycharm的作用,Pycharm并不是一个像matlab那样什么都自己提供的软件,它更像一个非常棒的搭桥软件:将Python和.py文件连接在一起.所以当你发现.py文件不能运行时,多半是因为.py文件的路径没有添加. 所以你需要将.py文件的路径添加了,一种是手动的方法: 1 点击配置文件 2 点击添加 3 选择python并添加.py文件路径 比如,本文中的设置如下: 当你

  • vscode 调试 node.js的方法步骤

    vscode 调试 node.js的方法步骤

    引言 作为前端工程师经常打交道的开发工具无非 IDE 编辑器 和 Chrome,在 Chrome 中调试是非常方便的,直接在 开发者工具的 source 栏打断点就可以了.那么,如果遇到需要写 node 相关的代码,比如 webpack 配置项,应该怎么调试来实现我们的需求呢? VS Code 配置 在 VS Code 中单独有 debug 的菜单,需要指定 launch.json 文件,该文件为 VS Code 提供启动调试所需的各项配置. // launch.json // 使用 Intel

  • MFC程序中使用QT开发界面的实现步骤

    MFC程序中使用QT开发界面的实现步骤

    目录 添加QT依赖 添加信号槽机制 添加qt界面 配置元编译过程 一些问题的处理 测试信号槽 使用qt designer 设计界面 如果你有一个现成的MFC项目在做维护,但是你厌倦了使用MFC繁琐的操作来做界面美化,或者你需要在这个项目中用到QT里面好用的某些功能:亦或者是你需要使用某些只能在MFC中使用的组件,但是界面这部分已经用QT做好了.那么这篇文章可能可以帮助到你 演示环境使用Visual Studio 2019 + QT5.12.8 版本 添加QT依赖 首先创建一个基于对话框的MFC工

  • VSCode搭建vue项目的实现步骤

    VSCode搭建vue项目的实现步骤

    目录 一.安装环境: 二.建项目: 一.安装环境: 1.默认Vscode.nodejs已经安装好了 2.全局安装vue-cli,vue-cli帮助我们快速构建Vue项目. npm install -g @vue/cli 3.安装webpack (打包js的工具) npm install -g webpack 二.建项目: 1.开始创建vue项目,首先创建一个文件夹用来存放项目,用vscode打开对应的文件夹,并在终端cd到对应的文件夹.比如我的文件夹就是VUE 注意:接下来的命令需要在cmd命令

  • C# WinForm制作登录界面的实现步骤

    C# WinForm制作登录界面的实现步骤

    在[解决方案资源管理器]中找到Form1.cs,单击,快捷键F2重命名为“Login.cs”(命名很重要,不然之后项目多了根据不知道哪个项目的内容是什么) 对窗体[Text]属性.[size]属性和[FormBoardStyle]属性进行修改 添加一个新的窗体 Ctrl+Shift+A,在弹出框中选择[Windows窗体],命名为main.cs 取消登录界面最大化最小化关闭按钮在父窗体菜单栏上显示最大化:MaximizeBox,最小化:MinimizeBox如果设置一个为False 的时候会显示

随机推荐