HTML简介及基础标签

夏志121

于 2022-05-01 15:41:00 发布

阅读量1.5k

点赞数 6

分类专栏： Web前端开发与Vue.js实践文章标签： html css linq intellij idea 前端

本文链接：https://blog.csdn.net/m0_61961937/article/details/124527052

版权

Web前端开发与Vue.js实践专栏收录该内容

35 篇文章 5 订阅

订阅专栏

一、什么是HTML

HTML是一门语言，所有的网页都是用HTML这么语言编写的

HTML(HyperText Markup Language)：超文本标记语言

超文本：超越文本的限制，比普通文本更强大，除了文字信息，还可以定义图片、音频、视频等内容。

标记语言：标记语言时一套标记标签，由标签构成的语言，HTML使用标记标签来描述网页。

HTML运行在浏览器上，HTML标签由浏览器来解析

HTML标签都是预定义好的。例如：使用<img>展示图片

W3C标准：网页主要由三部分组成

结构：HTML 表现：CSS 行为：JavaScript
前端技术参考手册：HTML 系列教程 (w3school.com.cn)https://www.w3school.com.cn/h.asp

二、HTML入门案例

1、新建文本文件，将后缀名改为.html

新建完改了后缀名，就是显示默认的浏览器样式

2、编写HTML结构标签

用记事本方式打开即可，然后编写此案例。可以在<body>中定义文字，也可以修改文字的颜色属性。

3、保存之后，双击点开结果

4、总结

1、HTML文件以.htm或.html为扩展名

2、HTML结构标签

标签	描述
<HTML>	定义HTML文档
<head>	定义关于文档的信息
<title>	定义文档的标题
<body>	定义文档的主体

3、HTML标签不区分大小写

4、HTML标签属性值单双引号皆可

5、HTML语法松散

三、HTML的语言特征

HTML代码由头和体组成

<html>

       <head>

              <title>标题</title>

       </head>

       <body>需要展示给用户看的信息内容</body>

</html>

<html>标签就相当于java类大括号

<head>中存放的都是网页的说明性内容，例如标题

HTML文件的扩展名为html（新的）或者htm （老的）

HTML文件由浏览器直接解析执行，无需编译，直接由上到下依次解析执行

HTML标签通常由开始标签和结束标签组成，例如<font>内容体</font>

开始标签和结束标签之间的内容叫做内容体

HTML没有内容体的标签叫做空标签，经由一个标签组成。例如：<br/>自关闭

HTML标签不区分大小写，为了方便阅读，建议使用小写

HTML标签是有属性的，格式为：属性名=”属性值”，属性值用引号引起，引号包括单引号和双引号，建议使用双引号

HTML标签建议包裹嵌套，不建议交叉嵌套

四、HTML基础标签

标签	描述
<h1> - <h6>	定义标题，h1最大，h6最小
<font>	定义文本的字体、字体尺寸，字体颜色
<b>	定义粗体文本
<i>	定义斜体文本
<u>	定义文本下划线
<center>	定义文本居中
<p>	定义段落
<br>	定义换行
<hr>	定义水平线

代码示例：

<!--html5的标识-->
<!DOCTYPE html>
<html lang="en">
<head>
    <!--页面的字符集-->
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<h1>我是标题 h1</h1>
<h2>我是标题 h2</h2>
<h3>我是标题 h3</h3>
<h4>我是标题 h4</h4>
<h5>我是标题 h5</h5>
<h6>我是标题 h6</h6>

<hr>
<!--
    html 表示颜色
        1、英文单词：red,pink,blue...
        2、rgb(值1，值2，值3)：值的取值范围：0-255 reg(255,0,0)
        3、#值1值2值3：值的范围：00-FF
-->

<font face="楷体" size="5" color="#ff0000">夏志121</font>
<hr>

1.水寒江静，满目青山，载月明归。——黄庭坚《诉衷情》<br>

2.烟水茫茫，千里斜阳暮。山无数。乱红如雨。——秦观《点绛唇·桃源》

<hr>
<p>
 1.水寒江静，满目青山，载月明归。——黄庭坚《诉衷情》
</p>
<p>
2.烟水茫茫，千里斜阳暮。山无数。乱红如雨。——秦观《点绛唇·桃源》
</p>
<hr>

人生自古谁无死<br>

<b>人生自古谁无死</b><br>
<i>人生自古谁无死</i><br>
<u>人生自古谁无死</u><br>

<hr color="blue">
<center>
<b>人生自古谁无死</b>
</center>

</body>
</html>

运行结果：

五、HTML转义字符

HTML源代码	显示结果	描述
<	<	小于号或显示标记
>	>	大于号或显示标记
&	&	可用于显示其他特殊字符
"	“	引号
®	®	已注册
©	©	版权
™	™	商标
&nbsp		不断行空白