inline-block,css的inlineblock

inline block是什么意思

是：inline-block

inline-block

简单来说就是在CSS中通过display:inline-block对一个对象指定inline-block属性，可以将对象呈递为内联对象，但是对象的内容作为块对象呈递。

inline、inline-block和block

1、inline元素的特点：行内元素，内容撑起宽度，无高度、宽度属性、padding和margin只有左右，无上下

2、block元素的特点：块级元素，单独占据一行，有高度宽度、padding、margin都有

3、inline-block：具备inline的不换行、block的高度宽度、有全部的padding、margin

inline和float都可实现一行显示：他们的区别如下：

1、float脱离文档流，inline不会

2、inline元素之间有4px的空格，float的元素必须高度一致，要不然会换行

3、可以在iniline元素间设置!----、margin-left：-4、父div 的font-size：0来解决空格

inline 的一个典型应用：模拟表格

title样式{

display：inline-block；

float：left；

width：20%；

}

content样式{

display：inline-block；

width：80%? ? //必须跟上面的宽度和为100

}

实现效果：表格样式，content内容会换行展示

block，inline和inline-block的区别

display:inline

inline元素不会独占一行，多个相邻的行内元素会排列在同一行里，直到一行排列不下，才会新换一行，其宽度随元素的内容而变化。

inline元素设置width,height属性无效。

inline元素的margin和padding属性，水平方向的padding-left, padding-right, margin-left, margin-right都产生边距效果；但竖直方向的padding-top, padding-bottom, margin-top, margin-bottom不会产生边距效果。

display:inline-block

简单来说就是将对象呈现为inline对象，但是对象的内容作为block对象呈现。之后的内联对象会被排列在同一行内。比如我们可以给一个link（a元素）inline-block属性值，使其既具有block的宽度高度特性又具有inline的同行特性。