html - 在 Bootstrap 中使用词缀的导航列表之后的图像

Question

我正在尝试将图像附加到导航列表的底部，并在页面滚动时将其保留在那里。

这就是我想要的：

这是我在词缀开始时得到的：

我需要它保持就像图片一一样。我试过用谷歌搜索问题并搜索堆栈溢出但没有结果。

这是代码：

<!--SIDEBAR NAVIGATION -->
                <ul class="nav nav-list well hidden-phone hidden-tablet" data-spy="affix" data-offset-top="850"> 
                    <li class="nav-header">The Green Panda</li>
                    <li class="divider"></li> 
                    <li><a href="#whatwedo">What We Do</a></li> 
                    <li class="divider"></li> 
                    <li><a href="#oursolutions">Our Solutions</a></li> 
                    <li class="divider"></li> 
                    <li><a href="#morethanwebdesign">More Than Web Design</a></li>
                    <li class="divider"></li> 
                    <li><a href="#contactinfo">Contacting Us</a></li>
                </ul>
                <img src="img/woody-effect.png" class="img-bottom nav-list" data-spy="affix" data-offset-top="850">

Answer 1

编辑：

选择器不正确。

如果菜单的高度是静态的，则可以在该图像切换到固定样式并应用此 css 时向该图像添加一个类：

top: 310px;

这会将其放置在菜单的底部。

我会在 .affix 下设置一个类并将其应用于您的图像（添加 id panda_logo）

#panda_logo.affix {
    top: 310px
}