javascript中display:inline-block;是什么意思?

2024-11-18 20:16:23
推荐回答(2个)
回答1:

display:inline-block
简单来说就是将对象呈递为内联对象,但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内,允许空格。

display:inline-block感觉与display:table-cell有些相似,例如对内部元素的包裹性。但是,由于
display:inline-block最大的不同就是其没有父元素的匿名包裹特性,这使得display:inline-block属性的使用非常自
由,可与文字,图片混排,可内嵌block属性元素,可以可以置身于inline水平的元素中。

采用inline-block布局还实现高度不等的布局。比如原新浪微博,见图片。(来源:张新恤的blog)

回答2:

inline-block是CSS中的属性,表示应该这个属于的元素变为行内块级元素。

这个属性是display对象的属性。display与此相同的属性还有

  1. display:none   表示应用该属性的元素不可见

  2. display:block  表示该用该属性的元素变为块级元素,也就表示该元素换一行显示

  3. display:inline-block 表示应用该属性的歹毒变为块级元素,但不换行。

  4. 另外还有像inline-table等。

在CSS中,块级元素像div,dd,table等,块级元素可以通过设置尺寸,来改变可视区域。而非块级元素,则设置尺寸也是无效的。像span,p,h1,a等这些标签,如果像改变尺寸,只能通过设为块级元素。

像楼主说的,在javascript中遇到这类的CSS属性,那一般就是通过javascript来动态的改变某个或某些元素的属性。一般的,在javascript中,可以动态设置任何HTML元素的CSS属性。