如何将图像和标记放在另一个HTML CSS之上?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (29)

目前,我正在尝试为href设置一个标记,并试图将其添加到图像的顶部,以便当我单击该图像时,它将我发送到该链接。href的格式已关闭,它将使其小于实际图像。我的代码在下面:

<div class="row">
            <div class="col-sm-6 col-md-3">
                <figure class="thumbnail">
                    <a href = "https://www.google.com" style = "position:relative; left: 200px"> 
                    <img src= "img/img-team-5.png" class= "img-responsive" alt= "Image">
                    </a>
                    <figcaption class="caption text-center">




                        <ul class="social-links">
                            <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                            <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                            <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                            <li><a href="#"><i class="fa fa-envelope"></i></a></li>
                        </ul>
                    </figcaption>
                </figure>
            </div>
提问于
用户回答回答于

即使“标签的面积”小于图像,图像也是可点击的。无论如何,如果你想要与图像大小相同的a标记,可以尝试:

a {
  display: inline-block;
}

扫码关注云+社区

领取腾讯云代金券