我的网站有一个启动页面,它在主 div 上作为背景图像实现:
#main
{
background:url('../img/splash.jpg');
background-repeat:no-repeat;
width:1024px;
height:768px;
margin:auto;
}
...
<body>
<div id="main">
...
</ div>
</body>
...
问题是我想让背景图像的一部分可点击进入我们的网站。我通过在我想要使用位置可点击的区域周围设置一个透明框来实现这一点:绝对:
#logo-link
{
position: absolute;
top: 30px;
left: 350px;
width: 600px;
height: 280px;
background-color: transparent;
}
...
<div>
<a id="logo-link" href="/mylink"></a>
</div>
...
当我在我的屏幕上设置盒子时,这有效,但我注意到盒子在其他屏幕分辨率上移动。到了分辨率更高的屏幕将框转移到阻止在我的网站上注册的表单域的地步!
我相信我对启动页面的可点击区域的实现很差,你能告诉我如何做得更好吗?
谢谢。