absolute与整体页面布局

absolute与width和height

天使的翅膀

脱离文档流二三事

各种对齐溢出技巧实例

居中以及边缘对齐定位

下拉框定位最佳实践

图片图标绝对定位覆盖

无依赖的absolute定位

别把我和relative栓在一起

absolute和float

absolute

vertical-align、基线

https://segmentfault.com/q/1010000000694663

https://www.zhangxinxu.com/wordpress/2015/08/css-deep-understand-vertical-align-and-line-height/

图片应用block后的间隙：

是img和div之间的间隙。为什么会有这么一个间隙。img本身是inline-block 水平的元素，因而会受到line-height与vertical-align(而vertical-align 默认是baseline对齐)的作用。而img,block 化之后，便不再受到line-height和vertical-align的影响。

解决方法这个存在的间隙的方法，如果img不设置block的话，可以尝试设置其父元素的，1.)可以尝试把 line-height设置足够小。2.)可以把vertical-align的对齐方式设置为bottom，middle，top。3.)font-size设置为0.

img是行内元素,不会发生重叠,即便img是块元素也不会发生重叠,把img当成拥有自己宽高的文字就可以了

2.先float：left再position：absolute可以去除浮动

原理：绝对定位的元素脱离了文档流（不占据之前的空间），而浮动元素依旧在文档流中浮动（依然占据之前空间）

1. 无依赖性的意思
   

高度自适应的九宫格效果

将内容区域想象为body，overflow：auto设置滚动条的出现

头尾、侧边栏各居其位:css代码

page满屏显示的css代码

width、height属性优先级高于left、top、right、width

即使父级容器的height是auto，只要容器是绝对定位拉伸形成，百分比高度值也是支持的

left、right同时设置时会拉伸absolute元素

除了static之外的其他定位会阻碍absolute元素的定位

top、left、bottom、right是组合使用的，一般四个用两个来控制

绝对定位元素一般不需要z-index

动画尽量作用在绝对定位的元素上！！（不会影响其他元素）

absolute的元素占据0px的空间，所以不会导致换行