首页 专题 文章 代码 归档
html结构
2020.01.18 16:54 2020.01.19 12:12

好啦,以上全都是准备工作,接下来我们来写你的第一个HTML程序吧!

Hello Html

您需要知道:所有HTML文件都是以.html为扩展名,所以我们在Vscode中建立第一个HTML文件:hello.html吧!

输入以下内容:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Hello Html</title>
</head>

<body>
    Hello, 这是我的第一个HTML程序!
</body>

</html>

然后我们右键选择“Open with Live Server”(这需要您安装了Live Server插件)

如下图:

截图-1579337047

然后就会自动打开您的默认浏览器,类似如下的内容:

截图-1579337090

HTML结构

好了,以上的代码就是最最最简单的一种结构,他包含了最基本的信息。

Tips:以上的代码是HTML5简化后的,HTML5前,会有一系列的其他信息!


那么最简单的结构,包含哪些内容?

<!DOCTYPE html> <!-- 一个文档类型标记 -->
<html lang="en">
<!-- lang="en" 是可以删掉的,不删掉也是可以输出中文的,只是诸如谷歌浏览器之类的,会显示该页面可以翻译! -->

<head>
    <!-- head标签,你可以理解为在这里的内容是给浏览器看的,用户看不到 -->
    <meta charset="UTF-8">
    <title>Hello Html</title><!-- 文档的标题 -->
</head>

<body>
    <!-- body标签,你可理解为是给用户看的,也就是说这里的所有内容基本是用户能看到的(注意是基本) -->
    Hello, 这是我的第一个HTML程序!
</body>

</html>
本节阅读完毕!
二维码图片 扫描关注我们哟