2025年1月31日 星期五 甲辰(龙)年 冬月廿九 设为首页 加入收藏
rss
您当前的位置:首页 > 计算机 > 软件应用 > 开发工具(IDE)

HTML入门:推荐1款免费好用的web开发工具

时间:01-19来源:作者:点击数:19
CDSY,CDSY.XYZ

工欲善其事,必先利其器。​今天主要就聊聊开发工具吧。市面上有很多开发工具,比如,Visual Studio Code (VS Code),Sublime Text ,notepad++, Hbuilder, WebStorm。

我比较推荐的是 vscode,相比其他 2 者,VS Code 完全免费,具有更低的学习门槛、更丰富的插件生态和更高的灵活性,因此更适合新手入门和个人开发者使用。

那现在,就来跟我一起详细了解一下 vscode 吧。

工具使用
  1. 软件安装

官网:https://code.visualstudio.com/,VS Code 是由微软开发的免费、开源的现代化代码编辑器,拥有丰富的功能和强大的生态系统。它有以下 4 点好处:

1)提供了丰富的插件和扩展,可以根据个人需求自定义功能,满足不同开发场景的需求。

2)内置了终端工具,可以在编辑器中直接运行命令,无需额外打开终端窗口,方便进行命令行操作和项目管理。

3)它还支持丰富的主题和定制选项,可以根据个人喜好调整编辑器的外观和行为,使得开发环境更加舒适和个性化。

4)当然,它还支持 Windows、macOS 和 Linux 等多个操作系统。

  1. 界面认识

如下图所示。我们当下常用的就是文件资源区,以及插件区了。

图片
  • 文件资源区:我们可以在本地新建一个文件夹拖入过来,在此就可以敲代码了。
  • 插件区:主要是用来安装一些扩展来提升效率,服务敲代码的。例如添加新的语言支持、自动完成、代码片段、主题、调试器等。
  1. 把界面设置成中文
    可能很多英语不太好的同学看到全英文,都有点懵了。不用慌,我们可以设置成中文模式。怎么做呢,通过安装插件。首先,点上图“插件区”的那个图标,然后搜索,找到如图所示的,点击其右侧的 install。安装一下。
    图片
    等待 n 秒,安装成功以后,右下角会如图所示,点击按钮重启即可。
    图片
    菜单栏,文件区等,就变成中文的啦。
    所有的 vscode 的插件安装,都可以通过这种形式,这是一种最方便的安装方式。
  2. 学会安装插件
    当然,我这里也推荐几个简单的插件,你可以自行搜索试着安装一下:
    • HTML CSS Support:提供 HTML 和 CSS 的智能提示、自动完成和代码片段。
    • Auto close Tag: 在输入 HTML 或 XML 标签时自动闭合标签。
    • Auto Rename Tag:自动重命名 HTML/XML 标签的插件,避免手动修改开始和结束标签。
    • Bracket Pair Colorizer:为代码中的括号添加颜色,帮助快速识别匹配的括号。
    • Color Highlight:可以在代码中直观地显示颜色的实际效果,方便开发者在编写 CSS 或其他样式文件时快速了解颜色的呈现方式。
    • vscode-icons: Visual Studio Code 的图标主题插件,用于为文件和文件夹添加自定义图标以提高可视化效果。
    • github Theme: 可以给 vscode 换肤,有多种明暗模式。

除了在软件内安装,其次,还可以通过 vscode 官网的插件市场,https://marketplace.visualstudio.com/VSCode ,来安装。

CDSY,CDSY.XYZ
方便获取更多学习、工作、生活信息请关注本站微信公众号城东书院 微信服务号城东书院 微信订阅号
推荐内容
相关内容
栏目更新
栏目热门
本栏推荐