01-VS_Code新建HTML以及代码架构讲解

一. 新建HTML

首先,笔者新建了一个文件,并且后缀命名成.html后缀。之后切换到英文输入法下,写一个感叹号!,如下图所示。

在这里插入图片描述

操作界面会弹出提示框,这个时候单机或者回车选中第一个感叹号!便会自动搭建框架,如下图所示

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>
<body>
	
</body>
</html>

二.网页框架讲解

在生成了网页框架后,我们看到第一行有这样一条代码

<!DOCTYPE html>

其中 !DOCTYPE 是文档类型声明,作用是告诉浏览器使用那种HTML版本显示本网页。
注:!DOCTYPE 需要写在 html标签的前面。

在一个C语言程序中,我们知道是从main函数开始运行,一直到大括号结束,所有要用到的程序都放在这个main函数中编写(注:此处忽略函数定义和全局变量定义以及头文件的调用),那么我们一个网页是从哪里开始写,又是从哪里结束的呢?
在网页中

<html> <\html>

就类似于C语言中的main函数的大括号,我们所有的程序都要写在这对括号之中完成。
head 从字面意思理解就是头部的意思,他是对我们网页的首部所作的一个设置,例如网页标题,文本编码以及大小等设置。其左右有点类似单片机程序中的初始化操作,是对一些陪着的设置功能。

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>键盘敲烂,月薪过万!</title>
</head>


body里则是网页主题的编写,在body中所作的操作都将在网页中直观的显示出来。

<body> </body>

本章在此仅给读者对HTML的框架有一个感性的认识,不做深入讲解,在后面的章节中会做详细的讲解。

三. 编写网页前需要注意的修改点

<html lang="en">

这句代码表示设置当前网页所使用的语言。en表示使用的是英文。如果使用en,在这个网页中,也同样是可以出现中文字符的,但是为了保险,在写代码前我们首先将其改为 zh-CN 表示是中文网页。它的作用仅用于提示网页当前网页的语言格式并且提供警示作用。

例如使用google浏览器打开的时候会自动提醒是否将其翻译成中文一样,如果将其设置为其他语言,打开时将自动询问你是否翻译。

第二个要注意的地方是下面这句代码

<meta charset="UTF-8">

这句话表示的是本文使用的文本编码格式。其中UTF-8是字体最全的编码格式,又称万国码。因此选用UTF-8最合适,不会产生外网打开出现乱码的情况。

注:GB2312: 中文简体编码;BIG5:繁体中文;GBK:国标(包含简体和繁体)

本章到此结束,下一章讲解如何编写一个最简单的网页以及各部分所代表的含义和用法。

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值