Question

在我的网站上，我已经映射了一张图片，如下所示：

<div style="text-align:center; width:1298px; margin-left:auto; margin-right:auto;">
<img id="img2" src="http://mk7vrlist.altervista.org/pictures/sfondogs.png" usemap="#img2" border="0" width="1298" height="660" alt="" />
<map id="_img2" name="img2">
<area shape="rect" coords="35,26,110,99" href="http://mk7vrlist.altervista.org/databases/application.html" alt="" title="If we are recruiting, you can ask for join our staff."    />
<area shape="rect" coords="1181,27,1256,100" href="http://mk7vrlist.altervista.org/databases/sendrecord.html" alt="" title="Send us your VRs."    />
</map>
</div>

我想在映射图像前放置一个文本区域，所以我可以使用z-index属性。

img
{
position:absolute;
z-index:-1;
}

在体内有一个textarea（id =“txtarea”）。顺便说一下，映射的图像不会出现在屏幕中心对齐;你可以帮帮我吗？我使用<body background="/persbg.jpg">作为页面背景。

Answer 1

img
{
position:relative;
z-index:-1;
}

因为position：absolute将相对于具有相对（或绝对）定位的下一个父元素。如果没有这样的父级，它将默认一直返回到元素本身，这意味着它将相对于页面本身放置。因此它不像你期望的那样位于中心位置。

<map>图像的z-index </map>

1 个答案: