HTML学习记录 | 青训营笔记

114 阅读1分钟

这是我参与「第五届青训营 」笔记创作活动的第1天。

学习笔记一 编辑环境#

一个好的开发环境可以为我们省下很多时间。虽然记事本也能来写HTML,但是显然效率会低一些。我使用的编辑器是Visual Studio Code,可以支持多种语言开发,当然用来写HTML也很方便。

Review1.1.png 那么如何使用VS code来编写HTML呢?
我们首先打开VS code,在上方菜单栏中选中文件来新建一个空白文档,也可以使用CTRL+N 来快速创建。然后如上图所示,为这篇文档选择开发语言,我们如上图选择HTML后,就可以开启我们的开发之路了。
在我们完成简单的代码编写后,就需要运行代码查看结果。VS code默认的方式是在控制台输出,这对于我们调试代码来说比较不方便。
因此我们可以安装插件Open in Browser来帮助我们在本地浏览器打开我们编写的代码。

Review1.2.png

安装完毕后,运行我们的代码查看结果

Review1.3.png

最后附上我常用的快捷键
ctrl+O 快速打开文件
ctrl+N 快速新建文件
ctrl+/ 快速注释
tab 快速向后缩进一格
shift+tab 快速向前缩进一格

本篇笔记主要记录VS code的使用方式,具体HTML编写还在学习中~,最后附上本次测试用的代码。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>Hellow HTML</h1>
</body>
</html>

参考文章
CSDN:如何用Visual Studio Code编写代码(以HTML为例) 链接:t.csdn.cn/lJre9