css - Bootstrap 轮播超链接不起作用

Question

我正在尝试制作一个轮播，其中每张幻灯片都链接到不同的页面。

我的基本轮播代码是

 <!-- Wrapper for slides -->
  <div class="carousel-inner" role="listbox">
    <div class="item active">
        <a href="about.html"> 
        <img src="img//tshirts/large/slide1.png" alt="" >

    </div>
    <div class="item">
        <a href="tshirts.html"> 
        <img src="img//tshirts/large/slide2.png" alt="">
    </div>
    <div class="item">
        <a href="sublimation.html"> 
        <img src="img//tshirts/large/slide3.png" alt="">
    </div>
    <div class="item">
        <a href="sweatshirts.html"> 
        <img src="img//tshirts/large/slide4.png" alt="">
    </div>
</div>

这很完美，一张接一张地显示所有 4 张幻灯片，然后回到开头 所以我想添加如下超链接

 <!-- Wrapper for slides -->
   <div class="carousel-inner" role="listbox">
    <div class="item active">
        <a href="about.html"> 
        <img src="img//tshirts/large/slide1.png" alt="" >

    </div>
    <div class="item">
        <a href="tshirts.html"> 
        <img src="img//tshirts/large/slide2.png" alt="">
    </div>
    <div class="item">
        <a href="sublimation.html"> 
        <img src="img//tshirts/large/slide3.png" alt="">
    </div>
    <div class="item">
        <a href="sweatshirts.html"> 
        <img src="img//tshirts/large/slide4.png" alt="">
    </div>
    </div>

现在，当我运行第二个代码时，第一张幻灯片是完美的，当点击进入页面时，一旦它滑到下一张幻灯片，就没有显示任何幻灯片，也没有一张是可点击的，它不会返回到第一张幻灯片

Answer 1

Please close hyper link tag, Like

<div class="item active">
        <a href="about.html"> 
        <img src="img//tshirts/large/slide1.png" alt="" >
        </a>

    </div>