【问题标题】:Horizontal ul li navigation bootstrap水平 ul li 导航引导程序
【发布时间】:2015-10-21 03:04:54
【问题描述】:

我有带有 bootsrap 的 ul li 导航,其中 li 具有固定宽度,并且我有很多 li,我想在移动设备上显示菜单的所有 li 元素(我不知道如何)

问题:我想在移动设备上以horizontal 方式显示所有菜单,但它正在运行vertical,以及如何将所有元素放到小屏幕上

https://jsfiddle.net/fvove846/

【问题讨论】:

标签: css twitter-bootstrap user-interface twitter-bootstrap-3 adaptive-ui


【解决方案1】:

你忘记了 CSS 中的 display:inline

试试这个代码

.table_ul_nav{
    display: block;
    list-style: outside none none;
    padding-left: 40px;
    display: inline;
}
.table_ul_nav>li{
    width: 130px;
    display: inline-block;
    text-align: center;
    padding: 8px;
    margin-top: 10px;
    font-size: 18px;
    font-weight: bold;
    display: inline;
}

【讨论】:

  • 但在移动设备上我的菜单看起来像 sh**,如何避免这种情况
  • 在移动设备上,您的示例将是垂直的,但是如何使其水平并制作一些不保留在屏幕上的元素,例如下拉菜单
猜你喜欢
  • 2012-12-04
  • 2016-02-08
  • 2012-03-03
  • 2013-04-01
  • 2013-06-15
  • 2011-10-04
  • 1970-01-01
  • 2012-05-06
相关资源
最近更新 更多