块级元素和行内元素的差别

首先,百度解释走一波:

块元素又名块级元素(block element),和其对应的是内联元素(inline element),都是html规范中的概念。块元素和内联元素的基本差异是块元素一般都从新行开始,相邻的块级元素将会在不同行显示。而当加入了css控制以后,块元素和内联元素的这种属性差异就不成为差异了。

然后说人话,简单点。可定义高和宽,有边框概念的元素称块级元素,与之相反就称为“行内元素”,显示在行中,即“行内框”。

块元素可以用width\height\minwidth\minheight\maxwidth\maxheight来定义宽度/高度/最小宽度/最小高度/最大宽度/最大高度,单位可以是px/%;行间距可以用px/%/倍数来定义,在自适应设计时最好用倍数来定义。

display 属性设置为 block时,可以让行内元素(比如 <a> 元素)表现得像块级元素一样;而设置为inline,可以让块元素表现为行内元素;设置为 none时,该框及其所有内容就不再显示,不占用文档中的空间。把一些文本添加到一个块级元素(比如 div)的开头,即使没有把这些文本定义为段落,它也会被当作段落对待

再则是否出现:

display="none|block|inline|inline-block|table"; 隐藏元素(不占位置空间)|显示为块级元素|默认,显示为内联元素,前后没有换行符|显示为内联的块元素,可以有块的属性如宽、高、边距;与nowrap结合可以形成横向排列 ,并撑开父容器。|按表格的样式显示,可以消除块之间默认的间距。

猜你喜欢

转载自blog.csdn.net/qq_34797972/article/details/81168456