我想先初步体验一下写网页的感觉,这个不难吧,如果没什么复杂的知识点需要记忆的话,我可以坚持五分钟,努力不打呼噜。

打开记事本,写几个字保存,把文件拖到浏览器里,搞定。一分钟都没用上,欧耶!

那我直接找一张图片拖进去是不是都不用写字的,我拖个视频进去就是多媒体了吧,这样敷衍是不可以的哦~~还有四分半钟。

……

一、下载编辑器

打开 https://code.visualstudio.com/ 可以看到那个大大的绿色下载按钮,选择和自己电脑系统对应的版本下载。

点此阅读编辑器简介

二、安装编辑器

把下载下来的文件双击运行,一路下一步(next),如果十分勤劳,可以考虑选择一个自己喜欢的安装位置。

三、认识一下

这款编辑器全面叫作 Visual Studio Code,嗯,太长记不住,所以缩写成 VS Code。

四、打开编辑器

安装好以后,在桌面或者开始菜单找到这款编辑器,打开。

五、新建文件

如果打开后的编辑器是介个样子(或者类似),可以按下 Ctrl+N,或者直接用鼠标在中间的空白处双击来新建文件。如果是英文界面也一样操作,不重要。

设置编辑器显示界面为中文的方法
VS Code

六、调整编程语言

在编辑器的右下角找 纯文本 或者 Plain text,点击,会看到这样的提示:

VS Code

选择 HTML,这是我们要写的语言。

编程语言是个啥

七、写代码!!!

首先一定把输入法切换为英文。一般是 Shift 键切换,然后在编辑器里输入 !。对,就是一个感叹号。这时候别动,你会看到这样的提示:

VS Code

按下 Tab 键(在键盘左上,数字 1 的左下方)。你就会看到神奇的一幕:

VS Code

编辑器里出现了一大堆代码,这是你写的哦,学习前端第一节课就写了这么多代码,可不许骄傲哦~~

代码提示和自动完成

八、修改一下

照着下图修改三个地方(白色标记),务必一字不差的抄哦~

VS Code
修改的都是些什么

九、查看

保存文件到一个你能找得到的地方,名字随便写,建议写 index.html,反正后缀要保证是 html

然后把文件拖到浏览器里查看效果吧~~

整整九步哦,超复杂地说。你学不会的,快点哭着求我,我一开心就给你退款了哦~

  • 装编辑器
  • 新建文件
  • 切换语言
  • 输入感叹号按 Tab
  • 改三处

我把这些总结成五条写在笔记里了,等我睡醒了再操作两遍,应该用不了五分钟。

(求放弃……

编辑器不用每次都装吧,所以就是四条,还行,一分钟内记得住。

不过,我不想不求甚解,所以希望可爱的小老鼠能把细节也给我解释一下,记得一分钟/五分钟的约定哦~

啾咪~(●’◡’●)

(为啥被夸可爱了我还好想哭……

我已经在每个知识点后面放上对应的说明链接了。并且在每次教程的最后也会列出这篇文章中出现的所有说明链接。

请务必学习并练习过后再去看这些部分哦~

(你别说话,我快溜了……