块元素与行内元素简单总结

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标签内部,个别文字设置时使用.

阅读更多
上一篇前端的基础自学分享,大家一起分享下
下一篇emmet语法基础版
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭
关闭