0

0

HTML结构元素是什么?HTML中各种结构元素的总结(纯文本)

不言

不言

发布时间:2018-07-21 16:46:24

|

4130人浏览过

|

来源于php中文网

原创

在一个网页文档中会有各种不同元素的展现。每个元素都有其特定的位置,为了让这些元素规范起来,就需要由html中的结构元素确定。

<base>

功能说明:<base> 标签为页面上的所有链接规定默认地址或默认目标。通常情况下,浏览器会从当前文档的 URL 中提取相应的元素来填写相对 URL 中的空白。

标准属性:href、target

href:设置或获取页面中所有链接在鼠标单击链接到的URL

立即学习前端免费学习笔记(深入)”;

target:设置或获取目标内容要显示于哪个窗口或框架

   _blank:在一个新的未命名的窗口载入文档

   _self:在相同的框架或窗口中载入目标文档

   _parent:把文档载入父窗口或包含了超链接引用的框架集

  _top:把文档载入包含该超链接的窗口,取代任何当前正在窗口中显示的框架

<body>……</body>

功能说明:定义HTML文档的主体,body包含HTML文档的所有内容。

标准属性:id(元素唯一标识)、class(类名)、title(显示在工具提示中的文本)、style(行内样式定义)、dir(设置文本方向)、lang(设置语言码)、background(网页背景图像)、bgcolor(背景颜色)、text(设置文字颜色)、link(设置链接文字的颜色)、alink(设置链接时文字的颜色)、vlink(设置链接后文字的颜色)、leftmargin(左外边距)、topmargin(上外边距)、bgproperties(让背景图片不跟随网页滚动,它只有一个参数fixed)

以后出现相同属性的时候解释过后就不再进行说明

<p>……</p>

功能说明:定义一个文档的段落

标准属性:align、id、class、title、style、dir、lang

使用要点:使用p来换行,并分隔段落。p元素是块元素,需要关闭标签

<span>……</span>

功能说明:用来组合文档中的内联元素

标准属性:align、id、class、title、style、dir、lang

<p>……</p>

功能说明:定义文档中的分区或节

标准属性:align、id、class、title、style、dir、lang

使用要点:p元素是用来为HTML文档内大块的内容提供结构和背景元素

<br>

功能说明:插入一个换行符

标准属性:id、class、title、style

<caption>……</caption>

功能说明:定义一个表格标题

标准属性:align(对齐方式,包括left(左对齐)、right(右对齐)、top(顶端对齐)、bottom(底部对齐))、id、class、title、dir、lang

使用要点:caption元素应该是table元素的子对象,caption标签必须紧随table标签之后。只能对一个表格定义一个标题,通常标题居中于表格之上。

<col>

功能说明:为表格定义列属性值,定义的对象可以包括表格中的一个或多个列

标准属性:id、class、title、style、dir、lang

可选属性:align(水平对齐方式,包括right(右对齐)、left(左对齐)、center(居中)、justify(两端对齐))

                 span(定义<col>应当横跨的列数,默认值为1)

                 valign(垂直对齐方式,包括top(顶端对齐)、middle(垂直居中)、bottom(低端对齐)、baseline(基线对齐))  

                 width(定义列的宽度)

colgroup

功能说明:定义表格列的分组

标准属性:id、class、 title、style、dir、lang

可选属性:align、span(定义col应当横跨的列数,默认值为1)、valign、width

使用要点:只有在table标签内部才是合法的,可以对列进行组合来进行相应的格式化

fieldset

功能说明:将表单内的相关元素分组

标准属性:id、class、title、style、dir、lang

使用要点:在字段集包含的文本和其他元素外面绘制方框

<legend>……</legend>

功能说明:可为fieldset定义一个标题

标准属性:id、class、title、style、dir、lang

使用要点:legend元素必须是fieldset内的第一个元素,此元素是内嵌元素,需要关闭标签

<iframe>……</iframe>

功能说明:创建包含外部文档的内联框架

标准属性:id、class、title、style

基本属性:name(定义内容页名称)、src(定义内容页URL)、frameborder(定义内容页的边框,取值为0/1,默认为1,0不显示边框,1在每个页面之间都显示边框)、marginwidth(定义框架中HTML文件显示的上下边界的宽度,默认值由浏览器决定)、marginheight(定义框架中HTML文件显示的左右边界的宽度,默认值由浏览器决定)、scrolling(定义是否有滚动条,取值yes/no/auto,默 认值auto)、align、height、width

使用要点:iframe元素的作用相当于在一个文档中嵌入另一个文档,或者像一个漂浮的frame,创建内嵌漂浮框架,在iframe内容源文档,background-color或body元素的bgcolor标签属性必须设置为transparent。此元素是块元素,需要关闭标签

<dl>

   <dt>……</dt>

   <dd>……</dd>

   <dt>……</dt>

   <dd>……</dd>

</dl>

功能说明:dd定义在列表中的显示样式

Qoder
Qoder

阿里巴巴推出的AI编程工具

下载

                  dl定义列表的显示样式

                  dt定义列表中的项目

标准属性:id、class、title、style、dir、lang

使用要点:dd通常在列表中缩进显示,dd元素是块元素,需要关闭标签

                  dl元素是块元素,需要关闭标签

                  dt 元素是块元素,需要关闭标签

h1……h6

<h1>……</h1>

功能说明:定义文章的标题

标准属性:align、id、class、title、style、dir、lang

使用要点:<h1>定义最大的标题,<h6>定义最小的标题,需要关闭标签

<html>……</html>

功能说明:声明文档本身是一个HTML文档

标准属性:dir、lang

基本属性:common(一般属性)、xmlns(代表xml命名空间)、dir

<ins>……</ins>

功能说明:定义文档中已被插入的文本

标准属性:id、class、title、style、dir、lang

使用要点:ins和del标签配合使用,用来描述文档中的更新和修正

<del>……</del>

功能说明:定义文档中已被删除的文本

标准属性:id、class、title、style、dir、lang

<li>……</li>

功能说明:定义一个列表项目

标准属性:id、class、title、style、dir、lang

使用要点:li标签可用在有序列表<ol>和无序列表<ul>中

<ol>……</ol>

功能说明:定义有序列表

标准属性:id、class、title、style、dir、lang

<ul>……</ul>

功能说明:定义无序列表

标准属性:id、class、title、style、dir、lang

<table>……</table>

功能说明:定义表格的相关格式

标准属性:align、id、class、title、style、dir、lang

使用要点:用来显示数据,table是一个块元素,需要关闭标签

<th>……</th>

功能说明:定义表格内的表头单元格

标准属性:id、class、title、style、dir、lang

基本属性:common、abbr(代表表头的简写)、axis(对单元格在概念上分类)、colspan(一行跨越多列)、headers(连接表格的数据与表头)、rowspan(一列跨多行)、scope(定义行或列的表头)、align、valign

使用要点:th元素内部的文本通常会呈现为粗体

<tr>……</tr>

功能说明:在表格中定义一行

标准属性:id、class、title、style、dir、lang

基本属性:common、align、valign

<td>……</td>

功能说明:定义表格中的一个单元格

标准属性:id、class、title、style、dir、lang

基本属性:common、abbr(代表表头的简写)、axis(对单元格在概念上分类)、colspan(一行跨越多列)、headers(连接表格的数据与表头)、rowspan(一列跨多行)、scope(定义行或列的表头)、align、valign

tbody

功能说明:定义一段表格主体的格式

标准属性:id、class、title、style、dir、lang

使用要点:可以将表格分为一个单独的部分,可将表格中的一行或几行合成一组,但是在表格中最好没有tbody标签,不能从一个tbody跨越到另一个tbody中

tfoot

功能说明:定义表格脚注的格式

标准属性:id、class、title、style、dir、lang

使用要点:tfoot元素内包含的有效标签有td、tr、th,任何给定的table对象都只能定义一个tfoot。此元素需要关闭标签

thead

功能说明:定义表头的格式

标准属性:id、class、title、style、dir、lang

使用要点:thead内部必须拥有tr标签,此元素不会改变显示。如果使用thead、tfoot和tbody元素,就必须使用全部的元素。它们出现的次序是thead、tfoot、tbody。必须在table元素内部使用这些标签

相关推荐:

HTML中元信息meta标记属性的分析(附代码)

 如何动态生成html元素以及为元素追加属性的方法介绍(附代码)

相关文章

HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

下载

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
雨课堂网页版登录入口与使用指南_官方在线教学平台访问方法
雨课堂网页版登录入口与使用指南_官方在线教学平台访问方法

本专题系统整理雨课堂网页版官方入口及在线登录方式,涵盖账号登录流程、官方直连入口及平台访问方法说明,帮助师生用户快速进入雨课堂在线教学平台,实现便捷、高效的课程学习与教学管理体验。

2

2026.02.12

豆包AI网页版入口与智能创作指南_官方在线写作与图片生成使用方法
豆包AI网页版入口与智能创作指南_官方在线写作与图片生成使用方法

本专题汇总豆包AI官方网页版入口及在线使用方式,涵盖智能写作工具、图片生成体验入口和官网登录方法,帮助用户快速直达豆包AI平台,高效完成文本创作与AI生图任务,实现便捷智能创作体验。

42

2026.02.12

PostgreSQL性能优化与索引调优实战
PostgreSQL性能优化与索引调优实战

本专题面向后端开发与数据库工程师,深入讲解 PostgreSQL 查询优化原理与索引机制。内容包括执行计划分析、常见索引类型对比、慢查询优化策略、事务隔离级别以及高并发场景下的性能调优技巧。通过实战案例解析,帮助开发者提升数据库响应速度与系统稳定性。

7

2026.02.12

Next.js全栈开发与SSR服务端渲染实战
Next.js全栈开发与SSR服务端渲染实战

本专题系统讲解 Next.js 框架在现代全栈开发中的应用,重点解析 SSR、SSG 与 ISR 渲染模式的原理与差异。内容涵盖路由系统、API Routes、数据获取策略、性能优化以及部署实践。通过完整项目示例,帮助开发者掌握高性能 SEO 友好的 React 全栈开发方案。

1

2026.02.12

Kotlin协程编程与Spring Boot集成实践
Kotlin协程编程与Spring Boot集成实践

本专题围绕 Kotlin 协程机制展开,深入讲解挂起函数、协程作用域、结构化并发与异常处理机制,并结合 Spring Boot 展示协程在后端开发中的实际应用。内容涵盖异步接口设计、数据库调用优化、线程资源管理以及性能调优策略,帮助开发者构建更加简洁高效的 Kotlin 后端服务架构。

24

2026.02.12

2026春节习俗大全
2026春节习俗大全

本专题整合了2026春节习俗大全,阅读专题下面的文章了解更多详细内容。

258

2026.02.11

Yandex网页版官方入口使用指南_国际版与俄罗斯版访问方法解析
Yandex网页版官方入口使用指南_国际版与俄罗斯版访问方法解析

本专题全面整理了Yandex搜索引擎的官方入口信息,涵盖国际版与俄罗斯版官网访问方式、网页版直达入口及免登录使用说明,帮助用户快速、安全地进入Yandex官网,高效使用其搜索与相关服务。

809

2026.02.11

虫虫漫画网页版入口与免费阅读指南_正版漫画全集在线查看方法
虫虫漫画网页版入口与免费阅读指南_正版漫画全集在线查看方法

本专题系统整理了虫虫漫画官网及网页版最新入口,涵盖免登录观看、正版漫画全集在线阅读方式,并汇总稳定可用的访问渠道,帮助用户快速找到虫虫漫画官方页面,轻松在线阅读各类热门漫画内容。

97

2026.02.11

Docker容器化部署与DevOps实践
Docker容器化部署与DevOps实践

本专题面向后端与运维开发者,系统讲解 Docker 容器化技术在实际项目中的应用。内容涵盖 Docker 镜像构建、容器运行机制、Docker Compose 多服务编排,以及在 DevOps 流程中的持续集成与持续部署实践。通过真实场景演示,帮助开发者实现应用的快速部署、环境一致性与运维自动化。

7

2026.02.11

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
CSS教程
CSS教程

共754课时 | 30.5万人学习

CSS3-瞬间提升网页逼格的利器
CSS3-瞬间提升网页逼格的利器

共56课时 | 17.3万人学习

HTML5-网页结构就靠你了
HTML5-网页结构就靠你了

共23课时 | 6.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号