HTML快速入门知识点集合

最新推荐文章于 2023-05-03 22:19:26 发布

@心海

最新推荐文章于 2023-05-03 22:19:26 发布

阅读量159

点赞数 4

分类专栏：网页专栏文章标签： html 前端

本文链接：https://blog.csdn.net/qq_58233395/article/details/121086785

版权

网页专栏专栏收录该内容

3 篇文章 0 订阅

订阅专栏

文章目录

前言

HTML作为前端网页开发的基础，我们当然是要了解并熟悉的啦，这篇文章主要是讲述一些快速入门的知识点，基础知识

一、什么是HTML？

超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。（当然这是官方的回答）我觉得直白一点，HTML就是用来创建一个网页的，我们需要学习他的标记语言，这样子才能搞出一个网页来（说实话，这个做出来老有成就感了）😏

二、HTML的基础知识

对于HTML来说，我觉得还是比较容易理解的，它主要有两部分构成的，头部元素和身体元素，就像人一样，有头有身体，不过，头部元素是不会展示在网页上，而身体元素是会展示在页面上。在头部元素之前，你还需要声明为HTML文档<!doctype html>大小写都可以（尖括号算是HTML的一种格式吧，就像C语言中的头文件必须要#开头，尖括号中的内容称为标记）。

HTML中的标记语言都需要放在<html></html>这对标记语言中，标记语言一般都是成对出现的哦（当然也有单个出现的，以后再告诉你们哦）

1.头部元素

作为头部元素，他~~也没那么重要~~当然很重要啦，作为头，当然也有自己的专属标签啦，<head></head>(要好好学英语，因为，这些都是用英语来命名的！！！)，<title></title>这个标签定义了不同文档的标题

    <head>
		<meta charset="UTF-8">
		<title>网页标题</title>
	</head>

2.身体元素

<body></body>这个标签主要用来展示网页内容，里面也可以嵌入其他标签

    <body>
      网页内容
	</body>

身体元素可以嵌入许多标签，元素，元素属性的概念请点击这个链接了解认识HTML的标签、元素和属性

下面我介绍一下基础标签：

标签	作用
<p></p>	段落标签（定义一个段落）
<h></h>	标题标签，有1~6个标题大小，h1是最大的标题，h6是最小的标题
<br/>	这个标签是单标签，换行标签
<hr/>	水平线标签
<font></font>	字体设置标签
<b></b>	定义粗体文本
<em></em>	定义着重文字
<strong></strong>	定义加重语气
<i></i>	定义斜体字
<ins></ins>	定义已经被插入文档中的文本
<u></u>	定义下划线文本
<big></big>	把文字大小设置为比普通文字大一级
<small></small>	把文字大小设置为比普通文字小一级
<sub></sub>	定义下标
<sup></sup>	定义上标
<del></del>	定义删除字
<pre></pre>	预设文本，保留空格和换行

这些标签是比较常用的，标签里面还有属性，比如下面完整代码中出现的align，这个是对齐方式，在大部分标签中都有这个属性，bgcolor是整个身体元素中的背景颜色，text是整个身体元素中字体颜色（如果后面有颜色更改，一般以后面更改的颜色为准），color是被定义在font标签中字体的颜色，size是字体的字号大小，face是字体名称，这是我代码中所用到的属性，嘻嘻(●ˇ∀ˇ●)

总结

以下是效果图，可以明显的看出那些标签的用处，除了<ins></ins>和<u></u>这两个标签，这两个我自己也看不出有啥区别🤔

完整代码如下，里面打字或者是插入一些其他标签就会有不一样的效果，每个标签都有各自的用法，😎嚯嚯嚯，谢谢观看🤞

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>前端页面</title>
	</head>
	<body bgcolor="black" text="white" >
		<h1 align="center">介绍HTML的基础标签</h1>
		<font color="lightgoldenrodyellow" size="5" face="楷体">
			<p align="center"><b>静</b>夜思</p>
			<p align="center">
			窗前<em>明月</em>光，<br />
			疑是地上<i>霜</i>。<br />
			举头望<strong>明月</strong>，<br />
			低头思故乡。<br />
		    </p>
		</font>
		<hr color="aquamarine" />
		<p>
			<font color="aqua" size="7" face="微软雅黑">
			<u>想</u>跟你借个<ins>未来</ins>，<small>有你的全部热情和热爱</small>，<sup>别怕</sup>光阴<sub>漫长</sub>，哪怕白发苍苍，<big>我也会在你身旁</big>
		    </font>
		</p>
		<hr color="azure" />
		<pre>
			*:ஐ٩(๑´ᵕ`)۶ஐ:* 学习使我进步
			<del>_φ(❐_❐✧ 人丑就要多读书</del>
			(。＿ 。） ✎＿学习计划走起
		</pre>
	</body>
</html>

@心海

关注

4
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML快速入门知识点集合

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言一、什么是HTML？二、HTML的基础知识 1.头部元素 2.身体元素总结前言HTML作为前端网页开发的基础，我们当然是要了解并熟悉的啦，这篇文章主要是讲述一些快速入门的知识点，基础知识一、什么是HTML？超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。（当然这是官方的回答）我觉得直白一点，HTML就
复制链接

扫一扫