Html 在调整横幅大小时设置链接

Html 在调整横幅大小时设置链接,html,css,hyperlink,banner,Html,Css,Hyperlink,Banner,我想在横幅上设置一个链接,根据屏幕宽度调整大小 现在我已经给出了完整图像的链接,如 我只希望按钮区域“查找这里”是可点击的 代码 您可以像这样尝试 设置位置:绝对并将左侧顶部中的%设置到链接 为了理解,我设置了opacity:0.5至链接 HTML <div class="outer"> <a href="http://google.com/" > <img src="http://s11.postimg.org/damg257c3/test.jpg"

我想在横幅上设置一个链接,根据屏幕宽度调整大小

现在我已经给出了完整图像的链接,如

我只希望按钮区域“查找这里”是可点击的

代码


您可以像这样尝试

设置
位置:绝对
并将
左侧
顶部中的
%
设置到
链接

为了理解,我设置了
opacity:0.5
链接

HTML

<div class="outer">
  <a href="http://google.com/" >
    <img src="http://s11.postimg.org/damg257c3/test.jpg" alt="" />
  </a>
</div>
<div class="outer">
    <img src="http://s11.postimg.org/damg257c3/test.jpg" alt="" />
  <a class="link" href="http://google.com/" ></a>
</div>
* {
  margin: 0;
}
img {
  max-width: 100%
}
.outer {
  position: relative;
  max-width: 1280px;
  margin: 0 auto;
}
.link {
  background: red;
    display: block;
    height: 12%;
    left: 24%;
    opacity: 0.5;

    position: absolute;
    top: 81%;
    width: 17%;
}