html行内元素、块级元素及空元素有哪些？区别是什么？

2021-04-22 16:28

阅读：772

标签：表格修改 splay 有一个不可 sub out 目录格式化

一、 html标签有哪些？

1）行内元素有哪些？

　　行内元素：行内大多为描述性标记

...
... 链接、锚点
换行
... 加粗
... 加粗
em - 强调
img - 图片
font - 字体设定 ( 不推荐 )
... 斜体
... 斜体
~~...~~ 删除线
strike - 中划线（已经废弃）
... 下划线
... 文本框
... 多行文本
下拉列表
^... 上标
_... 下标

2）块级元素有哪些？

　　块级元素：块级元素大多为结构性标记

... 地址
... 举中对齐块
...
标题一级
...
标题二级
...
标题三级
...
标题四级
...
标题五级
...
标题六级
水平分割线
...
段落缩进前后5个字符
... 滚动文本
无序列表
有序列表
...
定义列表
...
表格
...
表单
dir - 目录列表
...
常用块级容易，也是 css layout 的主要标签
fieldset - form控制组
...
段落
```
...
```
预格式化

3）空(void)元素有哪些？

//换行
//分隔线
//文本框等
//图片

二、行内元素和块级元素有什么区别？

　　根据 CSS 规范的规定，每一个网页元素都有一个 display 属性，用于确定该元素的类型，每一个元素都有默认的 display 属性值，比如 div 元素，它的默认 display 属性值为 “block”，成为“块级” 元素 (block-level)；而 span 元素的默认 display 属性值为“inline”，称为“行内” 元素。

区别一：

　　　　块级：块级元素会独占一行，默认情况下宽度自动填满其父元素宽度

　　　　行内：行内元素不会独占一行，相邻的行内元素会排在同一行。其宽度随内容的变化而变化。

区别二：

　　　　块级：块级元素会自动占据一定矩形空间，可以设置宽高

　　　　行内：行内元素没有自己的独立空间，不可以设置宽高

区别三：

　　　　块级：块级元素可以设置margin，padding

　　　　行内：行内元素水平方向的margin-left; margin-right; padding-left; padding-right;可以生效。但是竖直方向的margin-bottom; margin-top; padding-top; padding-bottom;却不能生效。