一、按块级元素、行级元素和行内块级元素分类
HTML元素可以分为块级元素和行内元素(又称行级元素),它们的主要区别在于它们在文档流中所占据的空间和如何与其他元素相互作用。
块级元素通常被用来表示文档中的大型结构,如段落、标题、列表、div、section等。块级元素独占一行或多行空间,并且可以包含其他块级元素或行内元素。常见的块级元素包括 <div>、<p>、<h1> ~ <h6>、<ul>、<ol>等。块级元素的默认宽度为父元素的 100%。
行内元素通常用来表示文本和其他小型元素,如超链接、文本强调、图片等。行内元素不会独占一行,它们只占据它们实际需要的空间。行内元素不能包含块级元素,但可以包含其他行内元素。常见的行内元素包括 <a>、<span>、<img>、<strong>、<em>等。行内元素的宽度和高度都是由它们所包含的内容决定的。
HTML5还引入了一种新的元素类型,叫做行内块级元素(inline-block)。行内块级元素与行内元素类似,但是它们的宽度和高度是可以设置的,同时也可以包含其他行内块级元素或行内元素。常见的行内块级元素包括 <input>、<button>、<select>、<textarea>等。
二、按用途分类
HTML中有多种不同类型的元素,这些元素可以用来表示文本、图像、视频、链接、表格、表单、页面结构等不同的内容和结构。以下是HTML中常见的元素类型:
-
文本元素: <h1> ~ <h6>、<p>,<span>用于文本的展示。
-
超链接元素: <a>,用于创建链接到其他页面或文档。
-
多媒体元素: <img>、<video>、<audio>、<picture>、<source>,用于插入图像、视频和音频。
-
列表元素: <ul>、<ol>、<li>,用于表示无序列表、有序列表和列表项。
-
表格元素: <table>、<tr>、<th>、<td>,用于表示表格和表格的行和单元格。
-
表单元素: <form>、<input>、<button>、<textarea>、<select>等,用于创建表单,包括文本框、单选按钮、复选框、下拉框等。
-
框架元素: <iframe>,用于嵌入其他网页或文档。
-
头部元素: <head>、<meta>、<title>等,用于定义文档的头部信息,如标题、关键字、描述、作者、字符编码等。
-
分区元素: <div>、<section>、<article>、<nav>、<aside>等,用于组织和划分文档内容的区块。
- 样式类元素: <link>、<style>,用于连接外部样式表或内部样式表。
-
脚本元素: <script>,用于嵌入JavaScript代码。
-
区块级别的元素: <header>、<main>、<footer>等,用于标识文档中的不同区域。
这些元素不仅构成了 HTML 文档的基本结构,而且可以结合 CSS 和 JavaScript 等技术,实现更加丰富和复杂的页面效果和交互行为。
标签:块级,行内,元素,HTML,文档,类型,用于 From: https://www.cnblogs.com/yuzhihui/p/17122505.html