前几天被人问,「如何把元素固定在容器底部」。(本来想直接把 demo 地址给他,结果没找到,那么今天我们来补一下) Demo 地址:http://jsrun.net/vIzKp/edit 想法思路 如果是页面底部,我
前几天被人问,「如何把元素固定在容器底部」。(本来想直接把 demo 地址给他,结果没找到,那么今天我们来补一下) Demo 地址:http://jsrun.net/vIzKp/edit 想法&思路如果是页面底部,我们可以直接 position: fixed;bottom: 0; 基于浏览器定位直接实现。 但是他要的效果是基于父级容器,那么我们必须要使用其他手段来定位了
使用 flex 实现
calc 实现如果不使用 flex ,那么我们可以用 calc 来减去 header 和 footer 空间。
absolute 实现如果 calc 兼容性不太好,那么还可以使用 absolute 将所有元素都脱离文档流。
|
2021-04-14
2021-04-29
2018-01-07
2022-06-10
2021-09-30