我在链接中设置图像,除了可点击区域扩展到整个容器(图像的父级)外(图像中的橙色部分)
Screenshot of the clickable zone
这是关于这个问题的代码的一部分(我没有全部插入,所有图像都有相同的问题。):
HTML
<a href="img/tableau/tableau-01.jpg">
<img src="img/tableau/tableau-01.jpg" alt="tableau 01"/>
</a>
<a href="img/tableau/tableau-02.jpg">
<img src="img/tableau/tableau-02.jpg" alt="tableau 02"/>
</a>
<a href="img/tableau/tableau-02.jpg">
<img src="img/tableau/tableau-03.jpg" alt="tableau 03"/>
</a>
CSS:
#container {
position: relative;
margin: 0 auto;
width: 960px;
height: 900px;
}
img {
height: 50%;
width: 50%;
max-width: 100%;
border: 1px rgba(255, 255, 255, 0.1) solid;
margin: 0 auto;
display: block;
-webkit-transition: all ease-in 0.13s;
-moz-transition: all ease-in 0.13s;
-o-transition: all ease-in 0.13s;
-ms-transition: all ease-in 0.13s;
transition: all ease-in 0.13s;
margin-bottom: 25px;
}
答案 0 :(得分:0)
为什么要将显示设置为阻止?如果你删除它并让我认为是内联块的默认值它修复它。如果你想让它居中,你可以使用其他方法。