Question

我正在尝试将固定图像放在网页的中心，我希望剩余的空间用背景或不透明度填充，但两者都不起作用。

＆＃13;

.imagecontainer
{ 
  
  float: left; 
 overflow: auto; 
  width: 100%;
  height: 100%;
  background: black;
}
.imagepop {
 
  background: black;
    max-width: 100%;
    max-height: 100%;
    bottom: 0;
    left: 0;
    margin: auto;
    overflow: auto;
    position: fixed;
    right: 0;
    top: 0; 
}

#topright {
  background: silver;
  text-decoration: none;
  border: 1px solid black;
    position: absolute;
    right: 0;
    top: 20;
    display: block;
   
}

＆＃13;

<div class="imagecontainer"><img id="image" src="http://img.cricinfo.com/espncricinfo/Img_nav-div-background.gif" class="imagepop" />
  <a id="topright" href="#" title="TopRight">Close</a></div>

＆＃13;

Answer 1

它确实有效，但你的imagecontianer是0px高度。添加

position: absolute

到您的图像保护程序

或简单方式：

.imagecontainer
{ 
  position:absolute;
  left:0;
  top:0;
  right:0;
  bottom:0;
  background: black;
}

全屏幕背景为图像周围的空白空间

1 个答案: