CSS世界—元素尺寸

1.display:inline-table

展示效果为可以和文字在一行显示的表格

width:auto的四种表现形式

1. 充分利用可用空间，也就是充满父元素
2. 收缩与包裹，即由其内容决定宽度
3. 收缩到最小，table-layout为auto的表格中，展现为最小宽度为一个中文字符的宽度
4. 超出容器限制，除非给定width，否则以上三种情况都不会超出父元素。但是如果是遇到内容很长的连续的英文或者数字，或者显式指定了white-space：no-wrap，则会发生超出的情况。

外部尺寸的流体特性：

1.正常流宽度： 无宽度，无图片，无浮动

• 无宽度：块级元素一旦设置宽度，流动性就丢失了。

所谓流动性，并不是看上去宽度100%这么简单，而是一种margin/border/padding和content内容区域自动分配水平空间的机制

2.格式化宽度： 仅出现在绝对定位模型中（absolute和fixed）

• 一般来说绝对定位元素宽度表现为包裹性，宽度由内部尺寸决定；
• 但是对于非替换元素，当left/right或者top/bottom属性存在的时候，元素宽度表现为格式化宽度，其宽度大小相对于最近的具有定位特性的祖先元素来计算；
• 格式化宽度具有完全的流体性，margin/border/padding和content内容区域自动分配水平空间

内部尺寸的流体特性