NavBar徽标未出现在Foundation 6 dist上

Question

Foundation 6: NavBar logo works locally on my machine but when I upload to server it does not appear. Foundation 6：NavBar徽标在我的计算机上本地工作，但是当我上传到服务器时它不会出现。 Site: www.adolfobarreto.atwebpages.com 网站：www.adolfobarreto.atwebpages.com

I've searched through the code and can find no errors. 我已经搜索了代码，没有发现错误。 Any Ideas? 有任何想法吗？

Thanks Adolfo 谢谢阿道夫

Html: HTML：

    <!doctype html>
<html class="no-js" lang="en">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Foundation for Sites</title>
    <link rel="stylesheet" href="assets/css/app.css">
  </head>
  <body>

    <!-- Small Navigation -->
    <div class="title-bar" data-responsive-toggle="nav-menu" data-hide-for="medium">
        <a class="logo-small show-for-small-only" href="#"><img src="\assets\img\fingerLogoXS.gif" /></a>
        <button class="menu-icon" type="button" data-toggle></button>
        <div class="title-bar-title">Menu</div>
    </div>
    <!-- Medium-Up Navigation -->
    <nav class="top-bar" id="nav-menu">
        <div class="logo-wrapper hide-for-small-only">
            <div class="logo">
                <img src="\assets\img\fingerLogosm.gif">
            </div>
        </div>
        <!-- Left Nav Section -->
        <div class="top-bar-left">
            <ul class="vertical medium-horizontal menu">
                <li><a href="#">Menu 1</a></li>
                <li><a href="#">Menu 2</a></li>
                <li><a href="#">Menu 3</a></li>
            </ul>
        </div>

        <!-- Right Nav Section -->
        <div class="top-bar-right">
            <ul class="vertical medium-horizontal dropdown menu" data-dropdown-menu>
                <li class="has-submenu">
                    <a href="#">Menu 4</a>
                    <ul class="submenu menu vertical medium-horizontal" data-submenu>
                        <li><a href="#">First link in dropdown</a></li>
                    </ul>
                </li>
                <li class="has-submenu">
                    <a href="#">Menu 5</a>
                    <ul class="submenu menu vertical" data-submenu>
                        <li><a href="#">First link in dropdown</a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </nav>
    <!--End Main Navigation-->
    <br />
    <br />
    <div class="row">
        <div class="medium-4 columns">
            <img src="http://placehold.it/450x183&text=LOGO" alt="company logo">
        </div>
        <div class="medium-8 columns">
            <img src="http://placehold.it/900x175&text=Responsive Ads - ZURB Playground/333" alt="advertisement for deep fried Twinkies">
        </div>
    </div>
    </header>
    <br>
    <div class="row">
        <div class="medium-8 columns">
            <p><img src="\assets\img\finger.jpg" alt="main article image"></p>
        </div>
        <div class="medium-4 columns">
            <p><img src="\assets\img\seo2.gif" alt="article promo image" alt="advertisement for deep fried Twinkies"></p>
            <p><img src="\assets\img\responsive.jpg" alt="article promo image"></p>
        </div>
    </div>
    <hr>
    <footer>
        <div class="row expanded callout secondary">
            <div class="large-4 columns">
                <h4>Portfolio Images</h4>
                <div class="row small-up-4">
                    <div class="column"><img class="thumbnail" src="http://placehold.it/75" alt="image of space dog"></div>
                    <div class="column"><img class="thumbnail" src="http://placehold.it/75" alt="image of space dog"></div>
                    <div class="column"><img class="thumbnail" src="http://placehold.it/75" alt="image of space dog"></div>
                    <div class="column"><img class="thumbnail" src="http://placehold.it/75" alt="image of space dog"></div>
                    <div class="column"><img class="thumbnail" src="http://placehold.it/75" alt="image of space dog"></div>
                    <div class="column"><img class="thumbnail" src="http://placehold.it/75" alt="image of space dog"></div>
                    <div class="column"><img class="thumbnail" src="http://placehold.it/75" alt="image of space dog"></div>
                    <div class="column"><img class="thumbnail" src="http://placehold.it/75" alt="image of space dog"></div>
                </div>
            </div>
            <div class="large-4 columns">
                <h4>Mission</h4>
                <P>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iste magnam a quam voluptates aliquam cum, quisquam
                    tempora sapiente minus, eos modi. Quia enim, doloremque deleniti. Voluptate nemo facilis, dignissimos temporibus.
                </P>
            </div>
            <div class="large-4 columns">
                <h4>Technologies</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deleniti quam voluptatum vel repellat ab similique
                    molestias molestiae ea omnis eos, id asperiores est praesentium, voluptate officia nulla aspernatur sequi
                    aliquam.
                </p>
            </div>
        </div>
        </div>
        <div class="row">
            <div class="medium-6 large-6 columns">
                <ul class="menu align-left">
                    <li><a href="#">Legal</a></li>
                    <li><a href="#">Partner</a></li>
                    <li><a href="#">Explore</a></li>
                </ul>
            </div>
            <div class="medium-6 large-6 columns">
                <ul class="menu align-right">
                    <li class="menu-text">Copyright © 2016 Adolfo Barreto</li>
                </ul>
            </div>
        </div>
    </footer>

    <script src="assets/js/app.js"></script>
  </body>
</html>

SCSS: SCSS：

 //Navigation
//__________


/* Small Navigation */
.logo-small {
  float: right;
}

.title-bar {
  padding: 0 .5rem;
}

.menu-icon,
.title-bar-title {
  position: relative;
  top: 10px;
}

/* Medium-Up Navigation */
@media only screen and (min-width: 40rem) { 

  .logo-wrapper {
    position: relative;
  }

  .logo-wrapper .logo {
    width: 92px;
    height:  92px;
    position: absolute;
    left: 50%;
    right: 50%;
    top: -6px;
    margin-left: -46px;
  }

  // Right part
  .top-bar-right {
    width: 50%;
    padding-left: 60px;
  }

  .top-bar-right ul {
    float:  left;
  }

  // Left part
  .top-bar-left {
    width:  50%;
    padding-right: 60px;
  }

  .top-bar-left ul {
    float:  right;
  } 
}

.menu-text {
    color: deepskyblue;
}

#footer-sep {
    padding: 1em;
}

Answer 1

All your image paths use backslashes instead of forward slashes. 您所有的图像路径都使用反斜杠而不是正斜杠。 Never use backslashes in paths, no matter if they are absolute, relative, or root relative paths. 绝对不要在路径中使用反斜杠，无论它们是绝对路径，相对路径还是根相对路径。

BTW the link to your website does not work. 顺便说一句，您网站的链接无效。

NavBar徽标未出现在Foundation 6 dist上

问题描述

1 个解决方案

解决方案1
1 已采纳 2016-01-05 20:03:53

NavBar徽标未出现在Foundation 6 dist上

问题描述

1 个解决方案

解决方案1 1 已采纳 2016-01-05 20:03:53

解决方案1
1 已采纳 2016-01-05 20:03:53