Question

我正在尝试将此地球图像放在准确的位置，但是当页面未全屏显示时，由于某种原因，地球图像会消失。我应该做些什么改变以确保当屏幕没有全屏时，图像保持在同一位置？

div.image {
   content:url(../images/logonew.png);

   position: absolute;
   left: 11.4%;
   top:1%;
   width: 77px;
   height: 69px;
   z-index: -1;
   repeat:no-repeat;
}

Answer 1

您的z-index：-1可能是问题的一部分，网页上的大多数内容默认为z-index：0，并且可以覆盖带有z-index的图像：-1。

无论如何，我个人发现对我有用的东西是这样的：

 <div style="position:relative">    <!--relative to preceding stuff on web page -->
 <img style="position:absolute" />  <!--absolute with respect to inside the <div> block -->
 <img style="position:absolute" />  <!--obviously you need to specify more style data than shown here! -->
 <!--as many more images as you like, organized to precise locations inside the <div> block-->
 <!--other elements can also be precisely positioned in the <div> block; things like <p> and <span>
     and <input> and <select> and <table> tags can have style data -->
 </div>
 <br />
 <br />
 <!-- use as many line-breaks as needed to reserve enough page-space for the stuff in the <div> block -->
 <br />
 <br />
 <!-- the rest of the web page now begins -->

图像需要处于相同的位置

1 个答案: