web前端之HTML技术_web 开发结构对用的常用技术是html?-CSDN博客

本文链接：https://blog.csdn.net/Viking_JoneJi/article/details/105722276

本文详细介绍了HTML的基础知识，包括HTML语法规范、基本结构标签、常用标签如标题、段落、文本格式化、布局、图像和超链接，以及表格、列表和表单的使用。通过对这些元素的理解和应用，读者能掌握构建网页的基本技能。

摘要由CSDN通过智能技术生成

web前端之HTML技术

1. HTML语法规范
- 1.1 基本语法概述
- 1.2 标签关系
2. HTML基本结构标签
- 2.1 结构标签
3. HTML 常用标签
4. HTML 中的注释和特殊字符
- 4.1 注释
- 4.2 特殊字符
5. 表格标签
6. 列表标签
7. 表单标签
- 7.1 表单的组成

web前端包括HTML+CSS+JavaScript三大主流技术，HTML是 超文本标记语言 (Hyper Text Markup Language)，网页的结构（类似于身体）；CSS是 层叠样式表 ( Cascading Style Sheets ) 的简称，就像外观装饰，美化HTML；JavaScript简称（JS）是一种表述语言，主管交互，是网页变“活”。

1. HTML语法规范

1.1 基本语法概述

HTML 标签是由尖括号包围的关键词，例如 <html>。
HTML 标签通常是成对出现的，例如 <html>和 </html> ，我们称为双标签。标签对中的第一个标签是开始标签，第二个标签是结束标签。
有些特殊的标签必须是单个标签（极少情况），例如 <br />，我们称为单标签。

1.2 标签关系

标签关系分为两类：包含关系和并列关系
包含关系：

<head> 
	 <title> </title> 
</head>

并列关系：

<head> </head>
<body> </body>

2. HTML基本结构标签

2.1 结构标签

每个网页都会有一个基本的结构标签（也称为骨架标签），页面内容也是在这些基本标签上书写。
HTML页面也称为 HTML 文档。

标签名	定义	说明
`<html></html>`	HTML标签	页面中最大的标签，我们称为根标签
`<head></head>`	文档的头部	在`<head>`标签中必须要设置的标签是`<title>`
`<title></title>`	文档的标题	让页面拥有属于自己的页面标题
`<body></body>`	文档的主体	包含文档的所有内容、页面内容

HTML 文档的的后缀名必须是 .html 或 .htm ，浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。

3. HTML 常用标签

3.1 标题标签

标签语义：作为标题使用，并且依据重要性递减。
为了使网页更具有语义化，我们经常会在页面中用到标题标签。HTML 提供了 6 个等级的网页标题，即从<h1> </h1>到<h6> </h6>，其中，数字每加一，文字会缩小一些。标题标签中的文字都是加粗独占一行。具体表现形式如下所示：

这是一级标题

这是二级标题

这是三级标题

这是四级标题

这是五级标题

这是六级标题
```
代码示例：
<h1>这是一级标题</h1>
<h2>这是二级标题</h2>
<h3>这是三级标题</h3>
<h4>这是四级标题</h4>
<h5>这是五级标题</h5>
<h6>这是六级标题</h6>
```
1. 特点
  数字每加一，文字会缩小一些。标题标签中的文字都是加粗独占一行。

3.2 段落和换行标签

<p> </p>标签语义：可以把HTML文档分割成若干段。

在网页中，要把文字有条理地显示出来，就需要将这些文字分段显示。在 HTML 标签中，<p></p>标签用于定义段落，它可以将整个网页分为若干个段落。具体表现形式如下所示：

这是

段落标签

代码示例：
这是<p>段落标签</p>

特点：
文本在一个段落中会根据浏览器窗口的大小自动换行。段落和段落之间保有空隙。

<br />标签语义：强制换行
在 HTML 中，一个段落中的文字会从左到右依次排列，直到浏览器窗口的右端，然后才自动换行。如果希望
某段文本强制换行显示，就需要使用换行标签<br />，也可以直接写成<br>。具体表现形式如下所示：

这是
换行标签
```
代码示例：
这是<br />换行标签
```
特点：
<br />是个单标签。<br />标签只是简单地开始新的一行，跟段落不一样，段落之间会插入一些垂直的间距。