如何使DIV元素不透明 [英] How to make DIV element opaque

问题描述

我在我的网站顶部有一个div，它是100％宽，在绝对和固定的位置。它的代码如下：

  div.header {
 height：60px; 
 width：100％; 
 position：absolute; 
 position：fixed; 
 top：0px; 
 left：0px; 
 background-color：#eeeeee; 
} 
  

现在一切正常，但当用户向下滚动网站内容这个。有没有办法防止这种情况发生？

解决方案

需要显示在前面的div元素应该有一个

例如

  div.header {
 .... 
 .... 
 z-index：9999; 
} 
 
 div.normal {
 .... 
 .... 
 z-index：9998; 
} 
  

在我的网站我有一个div页脚，总是出现在底部。我使用以下代码 - 它可能会在将来派上用场或搜索类似查询的人。

  #bottom 
 {
 position：fixed; 
 bottom：0px; 
 left：0px; 
 width：100％; 
 height：40px; 
 z-index：999; 
 background-color：rgb（30,122,212）; 
 border-top：3px solid black; 
 border-bottom：1px solid black; 
 -moz-box-sadow：0 0 10px white; 
 box-shadow：0 0 10px white; 
} 
  

我希望这有帮助。

I have a div at the top of my site which is 100% wide and in a absolute and fixed position. The code for it is like:

div.header{
    height: 60px;
    width: 100%;
    position: absolute;
    position: fixed;
    top: 0px;
    left: 0px;
    background-color: #eeeeee;
}

Now everything in that works, but when users scroll down the site content appears behind this. Is there a way that I can prevent this from happening?

解决方案

A div element that needs to be displayed on front should have a higher z-index value than the element that needs to be behind.

eg.

div.header{
....
....
z-index:9999;
}

div.normal{
....
....
z-index:9998;
}

On my website I have a div footer that always appears at the bottom. I use the following code - It may come in handy in the future or for someone searching for a similar query.

#bottom
{
    position: fixed;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: 40px;
    z-index: 999;
    background-color: rgb(30,122,212); 
    border-top:3px solid black;
    border-bottom:1px solid black;
    -moz-box-sadow: 0 0 10px white; 
    box-shadow: 0 0 10px white;
}

I hope this helps.

这篇关于如何使DIV元素不透明的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！