扫码关注官方订阅号
我粗略的画了下,有疑问的是A部分
我的页面用如下样式:
html, body { height: 100%; }
这个A部分取clientHeight剩下的高度,可以想到的办法是用定位做,top=xx; bottom=0;,不知道还有什么思路可以实现A部分的高度。
top=xx; bottom=0;
光阴似箭催人老,日月如移越少年。
height:calc(100% - 100px - 100px)
可以固定高度部分用padding写内容定位上去; 接下去A部分用height:100%写,使用calc的话可能存在兼容问题
方案1是
A { height: 100%; padding: 固定高度 .childnode { height: 100%; } }
方案二
固定高度+A { position: absolute; top: 固定高度; bottom: 0; }
方案二的好处是只要给固定高度一个样式就可以了,可以写成行内样式,也可以方便做例如隐藏固定高度这样的效果
固定高度
隐藏固定高度
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
扫描下载App
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
height:calc(100% - 100px - 100px)
可以固定高度部分用padding写内容定位上去; 接下去A部分用height:100%写,使用calc的话可能存在兼容问题
方案1是
方案二
方案二的好处是只要给
固定高度
一个样式就可以了,可以写成行内样式,也可以方便做例如隐藏固定高度
这样的效果