HTML的简介以及文档结构

最新推荐文章于 2021-06-15 11:47:32 发布

ChengMeng11

最新推荐文章于 2021-06-15 11:47:32 发布

阅读量511

点赞数

CC 4.0 BY-SA版权

文章标签： html

本文链接：https://blog.youkuaiyun.com/ChengMeng11/article/details/104619590

本文介绍了HTML的基本概念，包括HTML的定义、作用、版本和扩展名。HTML是一种超文本标记语言，用于制作网页和控制内容显示。文章详细讲解了HTML的文档结构，包括html标签、头部和主体部分，以及如何使用开发工具如Sublime进行编码。此外，还提到了常见浏览器的功能和作用，以及如何在浏览器中查看HTML页面。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

HTML

一、HTML（简介）

1.HTML是什么？

HTML:Hyper Text Markup Language 超文本标记（标签）语言
此语言，是由各种标签组成，用来制作网页，告诉浏览器该如何显示页面

我门看到的界面：

在这里插入图片描述

代码人员需要看的页面：

在这里插入图片描述

2、HTML的作用：

制作网页，控制网页和内容的显示；
插入图片、音乐、视频、动画等各种多媒体；
通过链接检索信息；链接：通过点击图标进入另一个页面叫做链接；
使用表单获取用户的数据，实现交互。表单：填写账户或密码的地方

3、HTML的版本：

W3C:world wide web consortium 互维网联盟,制定Web技术的相关标准和规范的组织, HTML就是由W3C制订的标准（www.3个w的具体内容和com的具体内容）；
两个版本: HTML 4.0.1 , HTML 500----通常H5；
官网: https://www.w3school.com.cn。

4、扩展名：

HTML文件的扩展名是以.html或.htm结尾

如图：

在这里插入图片描述

那如何去做一个网页呐？

最简单的网页（静态页面）

文件名：hello.html

代码：

<html>
	<head>
		<title>HTML学习</title>
	<head>
	<body>
		欢迎学习HTML页面
	</body>
</html>

案例：

在这里插入图片描述

二、HTML的文档结构

1、基本结构

1.1简介

html标签是由尖括号的关键词，如<html>,通常标签都是成对出现的，如： <html><html> ;
以<html>为根标签，包含：<head>头部和<body>主体部分；
头部提供关于网页的相关信息，如标题、文档类型、字符编码、关键词等摘要信息摘要信息；
主体部分提供网页要显示的内容，真正显示页面中的；
合理的缩进；
标签名不区分大小写,但一般要用小写。

在这里插入图片描述

1.2开发工具：

记事本（notepad）,sublime,notepad++,Dreamweaver,VScode,webstorm等
sublime的使用：

第一：打开sublime

第二：在里面进行新建文件(ctrl+N)，然后在进行保存(ctrl+S)，保存的时候，记得将扩展名输入上去（扩展名：.html或者.htm 都可以），不然的话，写出的代码，在网页上显示不出来。

在输入根标签或者头部标签等会特别麻烦，那么，可以使用Tab键，来进行快速生成，例如：根标签，输入html然后在按Tab，之后会直接生成<html></html>,只要是标签类型，都可以这样操作。

第三：将代码输入完后，课进行在浏览器中打开,进行验证。

代码：
```
<html>
	<head>
		<title>第一个HTML文件</title>
		<meta charset="utf-8">
	</head>
	<body>
		welcome to html!
	</body>
</html>
```
案例：

在这里插入图片描述

为了方便在sublime里面打开文件或图片等，可以单独建立一个文件夹（project），在这个文件夹中，可以再次创建三个文件夹（code，document，image）这三个，code里面可以放我们编写的代码，image里面可以放入我们需要的图片，可以方便我们打开以及使用。

将创建好的project文件夹直接拖进sublime里面，这样就可以更方便的使用了。

在这里插入图片描述