如何使导航栏中的 <li> 元素具有固定位置？答案

【问题标题】：How to make a <li> element in a navigation bar have fixed position?如何使导航栏中的 <li> 元素具有固定位置？
【发布时间】：2016-07-13 20:06:41
【问题描述】：

我有一个侧边导航栏，其中包含一个内容为“用户名”的列表元素。当我调整页面大小（使其更小）时，导航栏的滚动面板会出现，用户可以向下滚动到他想要的链接。如何使用户名列表元素出现在导航的底部，即使滚动条出现，它仍然会停留在导航的底部并仍然停留在那里，这样用户就不必导航到它？我只希望这个“用户名”元素始终可见（当用户滚动到它们时可以看到其他列表元素）。谢谢@

【问题讨论】：

请分享您的代码以帮助您..!!!
所以，我正在使用引导侧边栏模板 (blackrockdigital.github.io/startbootstrap-simple-sidebar) 假设我希望联系人页面链接始终可见，即使用户调整了页面大小以便滚动条导航菜单已出现。
你必须给我们你的代码的一部分来帮助你
你可以在 gitlab 上看到相同的行为...用户名始终在导航栏上可见
所以你想要一个粘性导航之类的东西？检查了 gitlab，虽然我在那里没有帐户，但我看到导航一直保持在顶部。是这个意思吗？

标签： javascript jquery html css

【解决方案1】：

你已经试过了吗？用户名

#username{
 position: fixed;
}

【讨论】：

好的。请尝试发布您的代码，以便我可以看到您做错了什么
我下载了这个：startbootstrap.com/template-overviews/simple-sidebar 然后我添加了用户名链接：
用户名

我在 .css 文件中添加了样式：#username { position: fixed; }

哦，我明白了。 li 元素在 sidewrapper 中，只要父元素不可见，则 li 元素也不可见。除非您使用另一种方法并使 userlame 元素独立于 sidewrapper 父级。