html – 子元素父母内容的100％大小

概述是)我有的： 一个具有固定大小但动态内容大小和溢出的块元素：scroll;. 我想要的是： 内容上的透明层,因此无论父卷轴滚动多远,图层都会覆盖内容. 我尝试了什么： .layer { position: relative; width: 100%; height: 100%; bottom: 100%; z-index: 20;} 在内容之后的父母内部. 问题： 该图层正确 是)我有的：

一个具有固定大小但动态内容大小和溢出的块元素：scroll;.

我想要的是：

内容上的透明层,因此无论父卷轴滚动多远,图层都会覆盖内容.

我尝试了什么：

.layer {  position: relative;  wIDth: 100%;  height: 100%;  bottom: 100%;  z-index: 20;}

在内容之后的父母内部.

问题：

该图层正确覆盖了父级,但只要我滚动它就不会覆盖内容.

小提琴：

http://jsfiddle.net/wYgWh/2/

红色应该涵盖一切,但不能太多;

解决方法 身高：100％;给元素提供与其父元素相同的高度.
您定义的父级不如您要覆盖的内容高.

如果将“图层”放在标记中的“内容”中,则可以相对于“内容”将其绝对定位.所以现在高度：100％将与内容而不是“父”(滚动窗口)相关.

此外,当你想要定位绝对的东西时,该元素将与它最接近的非静态父元素相关.

这是fiddle.

总结

以上是内存溢出为你收集整理的html – 子元素父母内容的100％大小全部内容，希望文章能够帮你解决html – 子元素父母内容的100％大小所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。