总结一下行内元素、块元素以及空元素。(因为太多了只列举常见的)
一. 常见行内元素
- 与其他行内元素并排,无法设置width和height。
- 宽高根据内容变化。
- 一般情况下,行内元素只能包含数据和其他行内元素。
| 标签名 | 描述 |
|---|---|
| i | 斜体 |
| em | 着重强调,斜体 |
| a | 锚点 |
| br | 换行符 |
| span | 短语内容的通用行内容器 |
| sub / sup | sub(下标)、sup(上标) |
| label | 表示用户界面中某个元素的说明 |
| strong | 表示文本十分重要,一般用粗体显示 |
二. 行内替换元素
- 属于行内元素,同时也属于替换元素,可以设置width和height属性
input、img、textarea
三. 常见块元素
- 独占一行,可以设置width和height。
- 如果不设置宽度,那么宽度将默认变为父级的100%。
- 块级元素可以包含行内元素和其他块级元素。
- 大部分HTML5新元素都是块级元素。
| 标签名 | 描述 |
|---|---|
| address | 提供联系信息 |
| article |
HTML5 文章区域 |
| aside |
HTML5 页面的侧边栏 |
| audio / video |
HTML5 audio(音频)、video(视频) |
| canvas |
HTML5 画布 |
| div | 通用型的流内容容器 |
| fieldset | 对表单中的控制元素进行分组(也包括 label 元素) |
| figure / figcaption |
HTML5 figure(独立的流内容)、figcaption(figure的标题) |
| header / footer |
HTML5 header(文档的头部区域)、footer( section 或 document 的页脚) |
| form | 表单 |
| h1 - h6 / hgroup | h1-h6(标题)、hgroup(标题组) |
| hr | 分割线 |
| ol / ul / dl | ol(有序列表)、ul(无序列表)、dl(定义列表) |
| output |
HTML5 定义不同类型的输出,比如脚本的输出 |
| p | 段落 |
| section | HTML5 |
| table | 表格 |
三. 常见空元素
- 没有内容的元素,也就是说一般直接闭合。
| 标签名 | 描述 |
|---|---|
| br | 换行符 |
| meta | 元数据信息 |
| hr | 分割线 |
| source | audio和video的媒体来源 |
| link | 外部资源链接 |
| input | 输入框 |
| img | 图片 |















网友评论