Question

www.encyclopediasindhiana.org/index2.php

我在php的帮助下设计了mycarousel的幻灯片放映，工作正常，但是在左侧的旋转木马的边缘，超链接直到旋转木马的高度才起作用。在左侧，如果图像与链接所覆盖的高度一样大，则所有链接都不起作用......您可以尝试旋转木马的第三张幻灯片/图像，因为它的高度很小，因此在高度工作之后会出现很多超链接。为什么这会发生在Chrome上，而在Internet Explorer上，所有链接都正常工作。

在bootstap.min.css文件中我已经删除了宽度539和高度自动，

.carousel-inner>.item>a>img, .carousel-inner>.item>img, .img-responsive, .thumbnail a>img, .thumbnail>img {
display: block;
max-width: 539;
height: auto;}

在index2.php的css中，我发现了

 <style>
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  width: 100%;
  margin: auto;
}

#myCarousel.carousel.slide {width: 100%; max-width: 539px; !important}
.carousel-caption {
 background:rgba(0, 0, 0, 0.3) !important;
 }



</style>

链接不工作outeside carousel可以java帮助，如果然后如何，PLZ我不太了解java

Answer 1

我从您的问题中了解到，由于轮播的容器放置在不可点击的链接上，因此某些超链接无法点击。一个快速的解决方案是从关于旋转木马的最近的块中删除类名“容器”。比如使用class =“sd”而不是class =“container sd”。另请注意，类名“容器”是bootstrap css中的预定义类，需要用于适当的区域并具有适当的结构。

对于调试问题，使用像firebug等html / css检查器工具，它将帮助你了解DOM树。

Answer 2

使用浏览器的开发人员工具检查页面上的元素，您会看到有一个<div class='container sd'>延伸到您的轮播左侧，并且链接重叠 - 这会阻止他们在div获得点击时工作相反的事件。删除container类会修复链接，但会对您的轮播中心产生轻微影响。

The relevant Bootstrap documentation明确指出容器不可嵌套，并且由于您已经使用container-fluid作为最顶层元素，因此您需要以其他方式解决该居中问题。

超链接没有工作在铬的旋转木马幻灯片放映的一面

2 个答案: