你如何使div的区域可点击？不是整个div!

Question

如果你在div中有一个背景图像,中间有一个(绘制)按钮,周围有一些其他图形.你如何使按钮可点击但不是整个div因为我不希望用户点击它周围的图纸,如果这是有道理的!？我是在浪费时间玩填充物和边距？我应该创建两个div吗？我的老板说他之前已经成功使用了一个div.

干杯

Answer 1

试试这段代码:

#container { width:200px; height:100px; position:relative }
#clicker { display:block; width:20px; height:10px; position:absolute; top:20px; left:100px; }

<div id="container">
    <a id="clicker" href="#link"></a>
</div>

显然,更改所有尺寸以匹配您想要点击的区域.

Answer 2

简而言之 - 你没有.

背景是背景.他们不满足.它们不是互动的.

有可能破解这一点,但你不应该.如果您有一些内容供用户与之交互,请将其作为内容呈现.用一个<img>.

Answer 3

放置一个透明且相对位于div内部的元素.将它放在按钮的顶部,使其与按钮的大小相同.使元素可单击.