博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
如何实现div的高度100%填充
阅读量:4975 次
发布时间:2019-06-12

本文共 504 字,大约阅读时间需要 1 分钟。

就我们所以了解的:一个div块级元素没有主动为其设置宽度和高度,浏览器会为其分配可使用的最大宽度(比如全屏宽度),但是不负责分配高度,块级元素的高度是由子元素堆砌撑起来的。

例如:

    
看看我的高度

实现效果:

-------------------------------------------------------------------------------------------------------------------------

此时的情况是父元素高度依赖子元素堆砌撑高,因此demo中的{height:100%;}是不起作用的。元素高度百分比需要向上遍历父标签要找到一个定值高度才能起作用,如果中途有个height为auto或是没有设置height属性,则高度百分比不起作用。

需要找到顶级父元素(即浏览器的高度),可以使用js获取浏览器的高度再进行设置,当然亦有简单的办法

实现效果:

 

转载于:https://www.cnblogs.com/whs5280/p/9298318.html

你可能感兴趣的文章
JDBC连接MySQL数据库及演示样例
查看>>
小波说雨燕 第三季 构建 swift UI 之 UI组件集-视图集(四)Alert View视图 学习笔记...
查看>>
多线程基础(二)pthread的了解
查看>>
百度SDK的使用第一天
查看>>
python学习笔记3:列表、元组和集合
查看>>
数组的初始化
查看>>
bzoj3156 防御准备
查看>>
Git----查看提交日志
查看>>
XE7/X10.2 Datasnap使用 dbExpress 连接MySQL数据库
查看>>
Eclipse修改编码格式
查看>>
生成器和协程 —— 你想知道的都在这里了
查看>>
初级算法-6.两个数组的交集 II
查看>>
欧拉函数 / 蒙哥马利快速幂 / 容斥
查看>>
Makefile
查看>>
软件开发文档以及项目开发流程理解
查看>>
2019微软Power BI 每月功能更新系列——Power BI 4月版本功能完整解读
查看>>
truncate 、delete、drop的区别
查看>>
DynamoDB 中的限制
查看>>
mysql做主从配置
查看>>
Docker练习例子:基于 VNCServer + noVNC 构建 Docker 桌面系统
查看>>