【HTML】HTML语言的使用方式和详细说明___完整教程（总结）

最新推荐文章于 2022-10-17 11:08:56 发布

YI_DIAN_DIAN

最新推荐文章于 2022-10-17 11:08:56 发布

阅读量3.4k

点赞数 9

分类专栏： ❸JavaEE ---- ----①HTML 文章标签： html

本文链接：https://blog.csdn.net/qq_35415600/article/details/70234315

版权

❸JavaEE 同时被 2 个专栏收录

46 篇文章 3 订阅

订阅专栏

---- ----①HTML

11 篇文章 0 订阅

订阅专栏

什么是 HTML？

HTML 是用来描述网页的一种语言。

HTML 指的是超文本标记语言 (Hyper Text Markup Language)

HTML 不是一种编程语言，而是一种标记语言 (markup language)

标记语言是一套标记标签 (markup tag)

HTML 使用标记标签来描述网页

什么是HTML标签？

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

HTML 标签是由尖括号包围的关键词，比如 <html>

HTML 标签通常是成对出现的，比如 <b> 和 </b>

标签对中的第一个标签是开始标签，第二个标签是结束标签

HTML 文档 = 网页？

HTML 文档描述网页

HTML 文档包含 HTML 标签和纯文本

HTML 文档也被称为网页

【注意】：HTML 文档是由 HTML 元素定义的。

何为HTML元素？

HTML 元素指的是从开始标签（start tag）到结束标签（end tag）的所有代码。

【注意】：

HTML的“元素”和“标签”总是被提及！！！

HTML的“元素”包含“标签”！！！

HTML的“元素”是整体的，“标签”是独立的！！！

例如：

开始标签                 元素内容             结束标签 
<p>                     This is a paragraph  </p> 
<a href="default.htm" > This is a link       </a> 
<br/> 

【注释】：注释：开始标签常被称为开放标签（opening tag），结束标签常称为闭合标签（closing tag）。

HTML 元素语法：：：

HTML 元素以开始标签起始

HTML 元素以结束标签终止

元素的内容是开始标签与结束标签之间的内容

某些 HTML 元素具有空内容（empty content）

空元素在开始标签中进行关闭（以开始标签的结束而结束）

大多数 HTML 元素可拥有属性

嵌套的 HTML 元素：：：

大多数 HTML 元素可以嵌套（可以包含其他 HTML 元素）。

HTML 文档由嵌套的 HTML 元素构成。

例如：

<html>
    <body>
    <p>This is my first paragraph.</p>
    </body>
</html>

【注释】：上面的例子包含三个 HTML 元素。

【注意】：

不要忘记结束标签

HTML 提示：使用小写标签

HTML结构：

html的结构分为两部分：head、body

<html>
    <head>
        <!--head元素中的内容-->
    </head>
    <body>
        <!--body元素中的内容-->
    </body>
</html>

HTML中标签格式：

格式：

<标签名 属性名=‘属性值’> 数据内容 </标签名>    
    或
<标签名 属性名='属性值' />

【注意标签中属性的使用方式】：

方式1：

对于某些标签，其属性名对应一个属性值，此标签中有多对“属性名=‘属性值’”这样的键值对，多个键值对中间用空格分开！！！
例如：

方式2：

对于某些标签，如<style>标签：
（1）其一个属性名中有多个键值对，
（2）所有的键值对由一对双引号引起来，
（3）每个键值对之间用分号“;”分隔开，

例如：

操作思想：

为了操作数据，都需要对数据进行不同标签的封装，通过标签中的属性对封装的数据进行操作。

标签就相当于一个容器。对容器中的数据进行操作，就是在不断的改变容器的属性值。

HTML中的所有属性：

一般的，几乎每个标签都有以下属性（标准属性）：

id、class、style、title

除此之外，每个标签还有自己的属性（独特属性）：

例如：<a>标签有：href、target、rel、name等等一系列的属性。

HTML中的所有事件属性：

一般最简单的事件相应事件就是：onclick();当鼠标被点击时候执行脚本。

还有其他的一些事件属性可以参考帮助文档。

HTML中的所有标签(按照功能类别排序)：

【基础】
标签 描述 
<!DOCTYPE>  定义文档类型。 
<html> 定义 HTML 文档。 
<title> 定义文档的标题。 
<body> 定义文档的主体。 
<h1> to <h6> 定义 HTML 标题。 
<p> 定义段落。 
<br> 定义简单的折行。 
<hr> 定义水平线。 
<!--...--> 定义注释。 

【格式】
标签 描述 
<acronym> 定义只取首字母的缩写。 
<abbr> 定义缩写。 
<address> 定义文档作者或拥有者的联系信息。 
<b> 定义粗体文本。 
<bdi> 定义文本的文本方向，使其脱离其周围文本的方向设置。 
<bdo> 定义文字方向。 
<big> 定义大号文本。 
<blockquote> 定义长的引用。 
<center> 不赞成使用。定义居中文本。 
<cite> 定义引用(citation)。 
<code> 定义计算机代码文本。 
<del> 定义被删除文本。 
<dfn> 定义定义项目。 
<em> 定义强调文本。 
<font> 不赞成使用。定义文本的字体、尺寸和颜色 
<i> 定义斜体文本。 
<ins> 定义被插入文本。 
<kbd> 定义键盘文本。 
<mark> 定义有记号的文本。 
<meter> 定义预定义范围内的度量。 
<pre> 定义预格式文本。 
<progress> 定义任何类型的任务的进度。 
<q> 定义短的引用。 
<rp> 定义若浏览器不支持 ruby 元素显示的内容。 
<rt> 定义 ruby 注释的解释。 
<ruby> 定义 ruby 注释。 
<s> 不赞成使用。定义加删除线的文本。 
<samp> 定义计算机代码样本。 
<small> 定义小号文本。 
<strike> 不赞成使用。定义加删除线文本。 
<strong> 定义语气更为强烈的强调文本。 
<sup> 定义上标文本。 
<sub> 定义下标文本。 
<time> 定义日期/时间。 
<tt> 定义打字机文本。 
<u> 不赞成使用。定义下划线文本。 
<var> 定义文本的变量部分。 
<wbr> 定义视频。 

【表单】
标签 描述 
<form> 定义供用户输入的 HTML 表单。 
<input> 定义输入控件。 
<textarea> 定义多行的文本输入控件。 
<button> 定义按钮。 
<select> 定义选择列表（下拉列表）。 
<optgroup> 定义选择列表中相关选项的组合。 
<option> 定义选择列表中的选项。 
<label> 定义 input 元素的标注。 
<fieldset> 定义围绕表单中元素的边框。 
<legend> 定义 fieldset 元素的标题。 
<isindex> 不赞成使用。定义与文档相关的可搜索索引。 
<datalist> 定义下拉列表。 
<keygen> 定义生成密钥。 
<output> 定义输出的一些类型。 

【框架】
标签 描述 
<frame> 定义框架集的窗口或框架。 
<frameset> 定义框架集。 
<noframes> 定义针对不支持框架的用户的替代内容。 
<iframe> 定义内联框架。 

【图像】
标签 描述 
<img> 定义图像。 
<map> 定义图像映射。 
<area> 定义图像地图内部的区域。 
<canvas> 定义图形。 
<figcaption> 定义 figure 元素的标题。 
<figure> 定义媒介内容的分组，以及它们的标题。 

【音频/视频】
标签 描述 
<audio> 定义声音内容。 
<source> 定义媒介源。 
<track> 定义用在媒体播放器中的文本轨道。 
<video> 定义视频。 

【链接】
标签 描述 
<a> 定义锚。 
<link> 定义文档与外部资源的关系。 
<nav> 定义导航链接。 

【列表】
标签 描述 
<ul> 定义无序列表。 
<ol> 定义有序列表。 
<li> 定义列表的项目。 
<dir> 不赞成使用。定义目录列表。 
<dl> 定义定义列表。 
<dt> 定义定义列表中的项目。 
<dd> 定义定义列表中项目的描述。 
<menu> 定义命令的菜单/列表。 
<command> 定义命令按钮。 

【表格】
标签 描述 
<table> 定义表格 
<caption> 定义表格标题。 
<th> 定义表格中的表头单元格。 
<tr> 定义表格中的行。 
<td> 定义表格中的单元。 
<thead> 定义表格中的表头内容。 
<tbody> 定义表格中的主体内容。 
<tfoot> 定义表格中的表注内容（脚注）。 
<col> 定义表格中一个或多个列的属性值。 
<colgroup> 定义表格中供格式化的列组。 

【样式/节】
标签 描述 
<style> 定义文档的样式信息。 
<div> 定义文档中的节。 
<span> 定义文档中的节。 
<header> 定义 section 或 page 的页眉。 
<footer> 定义 section 或 page 的页脚。 
<section> 定义 section。 
<article> 定义文章。 
<aside> 定义页面内容之外的内容。 
<details> 定义元素的细节。 
<dialog> 定义对话框或窗口。 
<summary> 为 <details> 元素定义可见的标题。 

【元信息】
标签 描述 
<head> 定义关于文档的信息。 
<meta> 定义关于 HTML 文档的元信息。 
<base> 定义页面中所有链接的默认地址或默认目标。 
<basefont> 不赞成使用。定义页面中文本的默认字体、颜色或尺寸。 

【编程】
标签 描述 
<script> 定义客户端脚本。 
<noscript> 定义针对不支持客户端脚本的用户的替代内容。 
<applet> 不赞成使用。定义嵌入的 applet。 
<embed> 为外部应用程序（非 HTML）定义容器。 
<object> 定义嵌入的对象。 
<param> 定义对象的参数。

总结：

对与HTML网页文档，利用一系列的HTML标签，含有多个属性，构成HTML元素，就可以显示出整个HTML网页文档了，

具体的标签、属性、就可以参考帮助文档来进行设计网页了！！！

YI_DIAN_DIAN

关注

9
点赞
踩
19

收藏

觉得还不错? 一键收藏
1
评论
【HTML】HTML语言的使用方式和详细说明___完整教程（总结）

什么是 HTML？ HTML 是用来描述网页的一种语言。 HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言，而是一种标记语言 (markup language) 标记语言是一套标记标签 (markup tag) HTML 使用标记标签来描述网页
复制链接

扫一扫