Question

我的旋转木马中的锚标记显示死链接。即不能将鼠标悬停在它上面。其他一切正常。但链接不在div内部工作。我已经使用了bootstrap中的所有文件，并且没有对脚本进行任何更改。

HTML：

<div class="carousel-inner">
    <div class="item active">
        <div class="fill" style="background-image:url('images/slide1.jpg'); background-size:cover;"></div>
        <div class="carousel-caption">
        <h1>Caption 1</h1>
        <p></p>
        <a href="#" class="read">Read More &raquo;</a>
        <br/>
        <div class="tech">
            <img src="images/tech.png" />
        </div>
    </div>
</div>
<div class="item">
    <div class="fill" style="background-image:url('images/slide2.jpg'); background-size:cover;"></div>
    <div class="carousel-caption">
        <h1>Caption 2</h1>
        <p></p>
    </div>
</div>
<div class="item">
    <div class="fill" style="background-image:url('images/slide3.jpg'); background-size:cover;"></div>
        <div class="carousel-caption">
            <h1>Caption 3</h1>
        </div>
    </div>
</div>

Answer 1

正如我从你的问题中可以理解的那样。

link is not working inside DIV

我会说您没有提供指向<a>标记的链接

<a href="#" class="read">

替换为：

<a href="http://www.google.com/" class="read">

更新：从css中删除你的风格

.carousel-indicators {
   top: 180px;
}

look into bootstrap.css line no: 6590

或从班级bottom: 10px; .carousel-indicators

中移除Line no: 6523

Answer 2

在为patel.milanb的回答提供的评论中，作者指出了他的问题的实例：http://itechnepal.com/new_site//

问题：包含轮播指示符的<ol>与链接重叠，因此链接无法点击。

从bottom: 10px;删除.carousel-indicators将解决此问题。

<强> CSS：

.carousel-indicators {
    position: absolute;
    /*bottom: 10px; <- remove this*/
    left: 50%;
    z-index: 15;
    width: 60%;
    padding-left: 0;
    margin-left: -30%;
    text-align: center;
    list-style: none;
}

<a> tag in my carousel is showing dead link in bootstrap</a>

2 个答案: