块元素与行内元素简单总结
1. 块元素
特点:
- 单个块元素在浏览器中默认独占一行
- 两个块元素不能够在一行显示, 他们会自动换成两行显示
- 块元素可以设置宽高等属性.
分类:
标题标签: 表示文档的标题, 除了具有块元素基本特征之外, 还含有默认的外边距和字体大小
段落标签: 表示文档中的一个文字段落, 除了具有块元素基本特征, 还含有默认的外边距
通用块容器标签: 表示文档中一块内容, 具有块元素基本特性, 没有其他默认样式
2. 行内元素
特点:
- 多个内联元素可以在一行显示
- 内联元素不能够设置宽高, 设置了也没有用, 不会显示出效果
- 内联元素的宽高由他们本身的内容多少来支撑, 内容多,宽高自动增加.
分类:
超连接标签a: 链接到另外一个网页, 具有内联元素基本特征, 默认文字蓝色, 有下划线
通用内联容器标签span: 具有内联元素基本特性, 没有其他默认样式,在文字段落的中间部分强调某一部分的时候调用span
图片标签img: 在网页中插入图片, 具有内联元素基本特性, 但是它支持宽高设置
注意点:
1. 可以根据这个元素是否在一行显示判断是否是块元素或行内元素,比如:label与input不能在两行各自显示,可以使用块元素将其包裹.
2. 块元素:可以设置宽高值, 独占一行
3. 行内标签:自动设置宽高值, 一行内可以有多个
4. 块级元素可以包含行内元素,行内元素不能包含块级元素
5. a 标签用于跳转(超链接) [跳转网页, 跳转页面, 跳转文件等]
6. 标题标签用于设置标题, 共有6级
7. div就是一个无色透明的容器,看不见,摸不到
8. img标签主要用于设置图片
9. p 标签就是paragraph(段落) 通常用于包裹段落
10. span是一个行内元素通常用于p标签内部,个别文字设置时使用.