html快捷键_创建⽹页的⽅法以及⽣成HTML⾻架
成长是⼀辈⼦的事⼉！⼤家好！我是时问新。分享前端、Python等技术，以及个⼈成长路上的那些事⼉。
现在我们开始创建第⼀个⽹页。
创建⽹页⽅法1：
1 在你⾃⼰的电脑上创建⼀个空⽂件夹，然后在vscode编辑器中打开这个⽂件夹。
2 在vscode中按快捷键ctrl+n新建⽂件，然后再按快捷键ctrl+s保存这个新建的⽂件，保存⽂件格式以“.html”为后缀。
下⾯我演⽰⼀下：
我在⾃⼰的电脑D盘建了⼀个⽂件夹叫“前端知识体系”，这个⽂件夹⾥⾯⼜新建了⼀个⽂件夹，叫“前端学习”。如下图：
前端知识体系这个⽂件夹⾥⾯还有⼀些思维导图⽂件，⼤家不⽤管，这是我之前做的知识梳理。
接下来我打开vscode，然后我们点击vscode最左边第⼀个“资源管理器”的按钮(当你⿏标停留在这个按钮上时，会显⽰“资源管理
器”⼏个字)时，就会展开或者关闭侧边栏，如下图：
当侧边栏为打开状态时，我们会看到⼀个叫“打开⽂件夹”的按钮，我们点击这个按钮，到并打开我们前⾯新建的⽂件夹“前端学习”，如下图：
然后我们点击“选择⽂件夹”，此时在侧边栏就会出现“前端学习”这⼏个字，如下图：
也就是说，以后我们在“前端学习”这个⽂件夹⾥⾯创建的⽂件，都会罗列在侧边栏的“前端学习”下⾯。
此时，我们按快捷键ctrl+n，来新建⼀个⽂件，
接着我们按快捷键ctrl+s，保存这个⽂件，此时就会弹出⼀个“另存为”的对话框，询问你刚才新建的⽂件以什么⽂件名进⾏保存。我们在“⽂件名”后⾯的输⼊框⾥⾯，把默认的“”这个⽂件名，改为⾃⼰想要的⽂件名。
注意：服务器上的⽂件名是不⽀持中⽂的，⽂件名的后缀.html⼀定也不能缺少。所以我们在这⾥取名为“first.html”，如下图：
当然我们现在只是学习，还不上传服务器，⽂件取中⽂名也没事。
接着我们点保存按钮，此时在vscode的侧边栏中，就会出现“first.html”，
此时，我们在电脑上创建的“前端学习”⽂件夹中，就会出现“first.html”这个⽹页⽂件，说明我们在vscode⾥⾯创建的⽂件，就保存在“前端学习”这个⽂件夹⾥⾯了。
另外，当我们⿏标停在侧边栏“前端学习”上时，后⾯就会出现4个⼩按钮，其中第⼀个⼩按钮是“新建⽂件”，点击它就会出现⼀个输⼊框，在输⼊框⾥⾯输⼊⽂件名，通过这种⽅法也可以在“前端学习”这个⽂件夹中，创建并保存⼀个新⽂件。如下图：
创建⽹页⽅法⼆：
1 在⽂件夹中直接点击右键“新建⽂本⽂件”。
2 将这个⽂本⽂件的.txt格式改为.html。
注意：必须要设置操作系统的“⽂件扩展名”为可见。如何设置呢？在⽂件夹⾥⾯点击“查看”，然后把“⽂件扩展名”前⾯打上勾，如下图：
如果你的操作系统是win10，就可以通过上⾯的⽅法设置“⽂件扩展名”为可见，但是如果你的操作系统是win7，设置“⽂件扩展名”为可见就⽐较⿇烦⼀点。所以如果你是win7，就⽤⽅法⼀创建⽹页吧，不要⽤⽅法⼆了。
⽤⽅法⼆创建⽹页，我在这⾥也举例说明⼀下。
我们在“前端学习”这个⽂件夹⾥，点击右键“新建-⽂本⽂档”，如下图：
此时就创建了⼀个⽂本⽂档，
接着我们把这个⽂本⽂档的名字改为“第三个⽹页.html”，
如何查看html代码
为了⽅⾯，我就把⽂件名写为中⽂的，因为现在不上传服务器，写中⽂名完全没问题。
这就是创建⽹页的第⼆种⽅法。
补充：虽然咱们看到的各种⽹页都是五颜六⾊的，但是实际上html⽂件是纯⽂本⽂件。因为html⽂件⾥⾯的内容是纯⽂字的，除了⽂字没有别的东西。
那你说我们看到的⽹站上还有各种图⽚，甚⾄有视频，这是因为⽹页上的图⽚或者视频，也都是通过⽂本形式来插⼊到html⽂件中的，所以html⽂件是纯⽂本⽂件，也因此，txt⽂件就能改为html格式⽽没有问题。
⽣成html⾻架
在输⼊法的英⽂模式下，输⼊！，然后再按tab键，就可⽣成html⾻架。
我们在vscode⾥⾯侧边栏随便点击⼀个⽹页，⽐如我们点击“first.html”，然后在代码编辑区输⼊⼀个英⽂的！，然后再按tab键，马上就⽣成了⼀个html的⾻架，如下图：
此时，我们注意，编辑区上⾯⽂件名字后⾯有⼀个⼩圆点，当有这个⼩圆点时，就表明这个⽂件的内
容没有被保存，这时我们按快捷键ctrl+s，就保存了这个⽂件，此时⼩圆点就消失了。
注意：如果你输⼊感叹号，再按tab键时，没有⽣成html⾻架，说明你创建的html⽂件，名字格式不正确，⽐如你把后缀.html写成了.hmtl，这就不能在编辑区智能感应⽣成html⾻架了。
感谢阅读！知识总结不易，请点个赞或转发⿎励⼀下呗！关注我，从零基础⼊门基本功扎实的前端⼯程师。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。