displayblock是什么意思?

其实在css display属性是什么意思?css中display属性的详解这篇文章中我们已经说过了display:block属性的意思了,简单的来说就是设置display:block就是将元素显示为块级元素。

看完了display:block的意思后,如果你还是不太了解,那么我们接着就往下看,看看display:block该怎么用?通过display:block的用法来更进一步的认识display:block的意思。

displayblock怎么用?

display是显示的意思,display:block就是将元素显示为块级元素,display:inline是将元素显示为行内元素,display:inline-block是将元素显示为行内元素但是又有块级元素的一些性质。

1、块级元素 display:block;

1、常见的块级元素有:p,div,table,pre,h1~h6,ul,ol,dl等

2、自动占领一行,多个块级元素则自动换行,默认情况下块级元素宽度自动填满父元素宽度

3、可以设置width,height属性

4、可以设置margin,padding属性

2、行内元素 display:inline;

1、常见的行内元素有:span,a,strong,em,input,img,br等

2、不独占一行,多个相邻的行内元素会在一行内排列,直到排列不下才换行,宽度由内容决定

3、不可以设置width,height属性

4、可以部分设置margin,padding属性:可以设置水平方向上的(left,right),不可以设置垂直方向上的(top,bottom),只有设置行高才可以增加行内框的高度

3、display:inline-block

定义:让元素像行内元素一样水平的依次排列,但是框的内容仍然符合块级框的行为。

1、不独占一行,多个相邻的行内元素仍在一行内排列,直到排列不下才换行。

2、可以设置width,height。

3、可以设置padding,margin。

推荐内容