HTML中的元素(elements)

HTML(HyperText Markup Language)中的元素(elements)定义了网页的结构和内容。以下是一些常见的HTML元素及其各自的作用:

文档结构元素:

  • <html>:根元素,包裹所有其他HTML元素。
  • <head>:包含文档的元数据,如标题、字符集声明、样式表链接、脚本等。
  • <title>:定义文档的标题,显示在浏览器标签页上。
  • <body>:包含文档的所有可见内容,如文本、图片、视频、游戏、可播放的音频等。

文本内容元素:

  • <h1> - <h6>:标题元素,<h1> 表示最高的标题级别,<h6> 表示最低的。
  • <p>:段落元素,用于定义文本段落。
  • <br>:换行元素,强制文本换行。
  • <hr>:水平线元素,用于创建主题分隔。
  • <em>:强调元素,通常呈现为斜体。
  • <strong>:加粗元素,通常呈现为粗体。
  • <small>:小号字体元素,用于呈现小号字体文本。
  • <mark>:标记元素,用于突出显示文本。
  • <del>:删除线元素,表示文本已被删除。
  • <ins>:下划线元素,表示文本已被插入。
  • <sub>:下标元素。
  • <sup>:上标元素。

链接和导航元素:

  • <a>:锚元素,用于创建超链接。
  • <nav>:导航元素,用于包含页面主导航链接。
  • <ul>:无序列表元素。
  • <ol>:有序列表元素。
  • <li>:列表项元素,用于<ul><ol>中。

图片和媒体元素:

  • <img>:图像元素,用于嵌入图像。
  • <video>:视频元素,用于嵌入视频内容。
  • <audio>:音频元素,用于嵌入音频内容。
  • <source>:源元素,为<video><audio>提供多种媒体源。
  • <iframe>:内联框架元素,用于嵌入另一个HTML页面。

表格元素:

  • <table>:表格元素,用于创建表格。
  • <tr>:表格行元素。
  • <th>:表格头元素,用于表头单元格。
  • <td>:表格数据元素,用于表格单元格。

表单和输入元素:

  • <form>:表单元素,用于收集用户输入。
  • <input>:输入元素,根据type属性的不同,可以是文本框、密码框、单选框、复选框等。
  • <label>:标签元素,定义输入字段的描述标签。
  • <button>:按钮元素。
  • <select>:选择元素,用于创建下拉列表。
  • <option>:选项元素,用于<select><optgroup><datalist>中定义选项。
  • <textarea>:多行文本输入元素。

分组和划分元素:

  • <div>:分区元素,用于划分页面上的区域或节。
  • <span>:跨度元素,用于对文档中的行内元素进行分组。
  • <header>:头部元素,用于包含介绍性内容或导航链接。
  • <footer>:页脚元素,用于包含页面的页脚信息。
  • <section>:节元素,用于定义文档中的一个独立部分。
  • <article>:文章元素,用于包含独立的内容。
  • <aside>:旁白元素,用于包含与页面内容关联度较低的内容。

元数据元素:

  • <meta>:元数据元素,用于提供关于HTML文档的元数据。
  • <link>:链接元素,用于链接外部样式表等资源。
    这些只是HTML中可用元素的一部分。每个元素都有其特定的语义和用途,合理使用这些元素可以创建结构良好、易于理解和访问的网页。
相关推荐
benbenAItalk2 小时前
数字人口播视频的批量生产实践:素材规范、任务编排与质量验收
java·前端·音视频
2601_962885722 小时前
如何用 Python 扫描 A 股跳空缺口并统计缺口回补概率?
java·前端·python
西瓜太郎12343 小时前
Claude Code、Codex CLI、Gemini CLI 能否共用一枚 Key?先看协议选择矩阵
前端·api 网关·claude code·gemini cli·codex cli
陈随易5 小时前
在Finch用了62亿词元,我认为这是新一代Agent工具之神
前端·人工智能·后端
水域安全老周5 小时前
水趣钓鱼救生衣专利拆解:两级锁紧如何解决落水人衣分离
java·前端·网络
计算机魔术师6 小时前
Anthropic CEO突然喊踩刹车,OpenAI罕见力挺:AI这辆车不能只踩油门了
前端
wing986 小时前
从codex转战workbuddy使用一周的感受
前端·人工智能·后端
EatFan6 小时前
Java接入支付宝 JSAPI 支付保姆教程(二):流程讲解与前后端代码讲解
前端·spring boot·后端·微信小程序·小程序·uni-app
梦想平凡6 小时前
百游棋牌源代码开发搭建教程(五):房间创建、座位分配与请求幂等实现
前端·javascript·数据库·源代码管理
IT_陈寒7 小时前
Redis的Set操作居然能把我的服务整挂了?
前端·人工智能·后端