Question

我和Bootstrap工作了很多但是，我无法弄清楚为什么我的模态不会在my portfolio website上工作，除了我的第一个作品集。数据目标和ID匹配。

    <a href="#lax-it" class="portfolio-link" data-toggle="modal" data-target="#lax-it">

    <!-- Laxadazikal -->
    <div class="modal fade bs-example-modal-lg" id="lax-it" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
      <div class="modal-dialog modal-lg">
        <div class="modal-content" style="padding:5px;">
          <h2 class="text-center">Laxidazikal</h2>
          <div class="row">
          <div class="col-md-10 col-md-offset-1">
            <hr>
            <p>Laxidazikal is a website for a lacrosse company. It is an ecommerce website as well as a business portfolio website. Kitchel needed an ecommerce store as well as training information and we loved the turn out. <br> <br> You can visit the website by clicking <a href="https://conneraiken.com/lax">here.</a></p>    
          </div>
          <div class="col-md-4" style="margin-left:37%;">
            <button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-times"></i> Close Project </button>
          </div>
        </div>
      </div>
    </div>
  </div>

Answer 1

您的<a>代码尚未关闭。如果你关闭它，它应该工作。

<a href="#lax-it" class="portfolio-link" data-toggle="modal" data-target="#lax-it">Click me to open up a modal dialog!</a>

将来，您应该考虑使用W3C Markup Validation Service工具来检查这些HTML问题。

这里是JSFiddle。

只有一个bootstrap模式工作

1 个答案: