Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/typo3/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
HTML：使飞溅图像有一个相对可点击的区域_Html_Css_Image - Fatal编程技术网
Fatal编程技术网
  • html/
  • HTML：使飞溅图像有一个相对可点击的区域

HTML：使飞溅图像有一个相对可点击的区域

html css image

HTML：使飞溅图像有一个相对可点击的区域,html,css,image,Html,Css,Image,我的网站有一个启动页，作为主div上的背景图像实现： #main { background:url('../img/splash.jpg'); background-repeat:no-repeat; width:1024px; height:768px; margin:auto; } ... <body> <div id="main"> ... </ div> </body>

我的网站有一个启动页，作为主div上的背景图像实现：

#main
{
    background:url('../img/splash.jpg');
    background-repeat:no-repeat;
    width:1024px;
    height:768px;
    margin:auto;
}

...
<body>
     <div id="main">
     ...
     </ div>
</body>
...

#主
{
背景：url（'../img/splash.jpg'）；
背景重复：无重复；
宽度：1024px；
高度：768px；
保证金：自动；
}
...
...
...
问题是，我想使一部分的背面图像点击到我们的网站。我通过使用position:absolute:

#logo-link 
{ 
        position: absolute; 
        top: 30px; 
        left: 350px; 
        width: 600px; 
        height: 280px; 
        background-color: transparent; 
}

...
<div>
    <a id="logo-link" href="/mylink"></a>
</div>
...

#徽标链接
{ 
位置：绝对位置；
顶部：30px；
左：350px；
宽度：600px；
高度：280px；
背景色：透明；
}
...
...
当我在我的屏幕上设置框时，这是可行的，但是我注意到框在其他屏幕分辨率上会移动。一个分辨率更高的屏幕会将框移到一个表单字段之外，以便在我的网站上注册

我相信我对启动页面的可点击区域的实现很差，你能告诉我如何做得更好吗

谢谢。

。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。 Hi现在定义
**#main**
位置：相对

像这样


#main{
position:relative;
}



将
位置：相对
添加到选择器
#main