我试图做一个半透明div覆盖整个屏幕。我试过这个:
#dimScreen { width: 100%; height: 100%; background:rgba(255,255,0.5); }
但是这并不覆盖整个屏幕,它只覆盖div内的区域。
解决方法
添加位置:固定。然后盖子固定在整个屏幕上,也当你滚动。
并添加也许margin:0; padding:0;所以它不会有一些空间的周围的封面。
并添加也许margin:0; padding:0;所以它不会有一些空间的周围的封面。
#dimScreen { position:fixed; padding:0; margin:0; top:0; left:0; width: 100%; height: 100%; background:rgba(255,0.5); }
如果不应该粘在屏幕上固定,使用position:absolute;
CSS Tricks也有一个关于全屏属性的有趣的文章。
编辑:
刚刚遇到这个答案,所以我想添加一些额外的东西。
喜欢Daniel Allen Langdon在评论中提到,添加top:0; left:0;确保,盖子粘在屏幕的顶部和左边。
如果你有一些元素在封面的顶部(所以它不覆盖一切),然后添加z-index。数字越高,它覆盖的级别越多。