Question

我目前正在尝试为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>

Answer 1

即使“标签区域”小于图像，该图像也是可单击的。无论如何，如果您想要一个与图像大小相同的标签，可以尝试：

a {
  display: inline-block;
}

是您想要的吗？

如何将图像和标签放在彼此的HTML CSS之上

1 个答案: