块级元素block
特点:
- 块级元素独占一行
- 多个块级元素排序方式从上到下
- 宽度默认为父元素的宽度
-
<p>
:定义段落 -
<div>
:定义文档中的区域 -
<ul>
:定义无序列表 -
<ol>
:定义有序列表 -
<li>
:定义自定义列表 -
<article>
:定义可独立分配的内容区域,通常用于文章。 -
<address>
:定义文档或文章的作者联系信息。如果位于<body>
元素内,它表示文档联系信息。位于<article>
元素内,它表示文章的联系信息。 -
<aside>
:定义独立于该内容的一部分并且可以被单独的拆分出来而不会使整体受影响,通常表现为侧边栏。 -
<blockquote>
:定义引用 -
<dl>
:定义列表 -
<dt>
:定义列表中的标题条目 -
<dd>
:定义列表中的条目 -
<fieldset>
:定义一个逻辑上的表单区域,存放相关的表单字段,常与<legend>
元素一起使用,它用于提供标题或说明。 -
<footer>
:定义文档或节的页脚 -
<form>
:定义一个用户可输入的表单,用于向服务器传输数据,可以包含<input>
元素。 -
<h1>-<h6>
:定义标题,<h1>
定义最大的标题,<h6>
定义最小的标题。 -
<header>
:定义文档的页眉,用于介绍信息。 -
<hr>
:在HTML页面中创建一条水平线 -
<nav>
:定义导航链接 -
<section>
:定义文档中的节 -
<table>
:定义HTML表格。简单的HTML表格由table元素以及一个或多个tr、th或td元素组成。 -
<tr>
:定义表格中的行 -
<th>
:定义表格中的表头 -
<td>
:定义表格中的列
内联元素inline
特点:
- 不独占一行
- 高宽度无效,对外边距(margin)和内边距(padding)仅设置左右方向有效,上下无效。
- 内联元素的高度通常由其内容决定,行高属性指定了文本行框的高度,它决定了行内文本在垂直方向上的布局。
- 行内元素不能放块级元素
-
<a>
:定义标签用于从一张页面链接到另一张页面。未被访问的链接带有下划线而且是蓝色的,已被访问的链接带有下划线而且是紫色的。 -
<b>
:定义字体加粗 -
<br>
:定义换行 -
<button>
:定义一个按钮 -
<cite>
:定义引用 -
<code>
:定义代码文本 -
<em>
:定义强调 -
<i>
:定义图标 -
<img>
:创建被引用图像的占位空间 -
<input>
:定义搜集用户信息的输入框,通常放在表单中。 -
<label>
:定义一个<input>
的标注 -
<script>
:定义JavaScript脚本 -
<select>
:创建单选或多选下拉框 -
<span>
:用于组织文档中的文字,便于通过样式格式化。 -
<strong>
:把文本定义为语气更强的强调的内容 -
<sub>
:定义文本上标 -
<sup>
:定义文本下标 -
<textarea>
:定义多行文本输入框 -
<time>
:定义公历的时间(24小时制)或日期
行内块级元素 inline-block
-
<img>
:创建被引用图像的占位空间 -
<input>
:定义搜集用户信息的输入框,通常放在表单中。 -
<button>
:定义一个按钮 -
<select>
:创建单选或多选下拉框 -
<textarea>
:定义多行文本输入框 -
<label>
:定义一个<input>
的标注 -
<span>
:用于组织文档中的文字,便于通过样式格式化。