Question

我的html代码在我的计算机（本地）上完美运行，但是当我将其上传到服务器并在浏览器中查看时，它无法正确显示。具体来说，我正在构建一个8图像照片库。这是代码。你能帮我找出问题吗？

    <!--Start section-->
  <section class="well well-bottom-null text-center">
    <div class="container container-wide">
    <h1>Services</h1> 
    <hr>

     <div data-lightbox="gallery" class="row row-no-gutter offset-2">

          <div class="col-xs-6 col-sm-6 col-md-3">
            <div class="img-thumbnail text-center"><a href="images/strategy1.jpg" data-lightbox="image"><img src="images/strategy1.jpg" alt="" class="img-wide">
                <div class="caption">
                  <h1>Strategic & Business Planning</h1>
                  <p>Proforma P&L Budgeting, <br> Business Plans</p>
                </div><span class="overlay"></span></a></div>
               </div>

          <div class="col-xs-6 col-sm-6 col-md-3">
            <div class="img-thumbnail text-center"><a href="images/competitive.jpg" data-lightbox="image"><img src="images/competitive.jpg" alt="" class="img-wide">
                <div class="caption">
                  <h1>Competitive Analysis</h1>
                  <p>Situation Analysis, Virtual Market Surveys, Market Research</p>
                </div><span class="overlay"></span></a></div>
               </div>

          <div class="col-xs-6 col-sm-6 col-md-3">
            <div class="img-thumbnail text-center"><a href="images/lead.jpg" data-lightbox="image"><img src="images/lead.jpg" alt="" class="img-wide">
                <div class="caption">
                  <h1>Lead Generation</h1>
                  <p>Inbound Marketing</p>
                </div><span class="overlay"></span></a></div>
               </div>

          <div class="col-xs-6 col-sm-6 col-md-3">
            <div class="img-thumbnail text-center"><a href="images/web-design.jpg" data-lightbox="image"><img src="images/web-design.jpg" alt="" class="img-wide">
                <div class="caption">
                  <h1>Website Design</h1>
                  <p>Design, Content Generation, SEO</p>
                </div><span class="overlay"></span></a></div>
                </div>

          <div class="col-xs-6 col-sm-6 col-md-3">
            <div class="img-thumbnail text-center"><a href="images/social.jpg" data-lightbox="image"><img src="images/social.jpg" alt="" class="img-wide">
                <div class="caption">
                  <h1>Social Media Marketing</h1>
                  <p>Social Relevance <br> Social Engagement</p>
                </div><span class="overlay"></span></a></div>
                </div>

           <div class="col-xs-6 col-sm-6 col-md-3">
            <div class="img-thumbnail text-center"><a href="images/blog.jpg" data-lightbox="image"><img src="images/blog.jpg" alt="" class="img-wide">
                <div class="caption">
                  <h1>Content Generation</h1>
                  <p>Videos, Blogs, E-books, Articles</p>
                </div><span class="overlay"></span></a></div>
                </div>

           <div class="col-xs-6 col-sm-6 col-md-3">
            <div class="img-thumbnail text-center"><a href="images/promo.jpg" data-lightbox="image"><img src="images/promo.jpg" alt="" class="img-wide">
                <div class="caption">
                  <h1>Marketing Collateral & Promotion</h1>
                  <p>Brochures, Post Cards, Flyers, Promotional Items</p>
                </div><span class="overlay"></span></a></div>
                </div>

            <div class="col-xs-6 col-sm-6 col-md-3">
            <div class="img-thumbnail text-center"><a href="images/events.jpg" data-lightbox="image"><img src="images/events.jpg" alt="" class="img-wide">
                <div class="caption">
                  <h1>Corporate Events</h1>
                  <p>Trade Shows, Sales Meetings, <br> Customer Appreciation, <br>Team Building</p>
                </div><span class="overlay"></span></a></div>
                </div>


        </div> 
       </div>
    </section>

Answer 1

可能有很多东西，但我会开始确保将bootstrap文件夹上传到您的服务器而不只是本地计算机上。

如果这不是问题，那就是CSS中的内容。

我的HTML代码在我的计算机上运行完美，但在浏览器中运行不正常

1 个答案: