icon-bar类不在Button中显示行
icon-bar类是Bootstrap框架中的一个CSS类，用于创建一个水平的图标导航栏。它通常用于创建响应式的网页导航栏，其中包含一些图标按钮，以便用户可以轻松地浏览和导航网站的不同部分。
icon-bar类的主要作用是为按钮添加一个水平的图标导航栏，以增强用户界面的可用性和易用性。它可以与Button元素结合使用，以创建具有图标按钮的导航栏。但是，如果icon-bar类不在Button中显示行，可能是由于以下几个原因：
- CSS样式冲突：可能存在其他CSS样式或规则与icon-bar类冲突，导致其在Button中无法正确显示。可以通过检查和调整CSS样式来解决冲突。
- 缺少必要的HTML结构：icon-bar类通常需要特定的HTML结构来正确显示。可能缺少必要的HTML结构或元素，导致icon-bar类无法正常工作。可以通过检查HTML结构并确保正确使用所需的元素来解决此问题。
- Bootstrap版本问题：如果使用的是较旧的Bootstrap版本，可能存在与icon-bar类相关的问题。可以尝试更新到最新版本的Bootstrap框架，以解决可能存在的问题。
总结起来，如果icon-bar类不在Button中显示行，需要检查CSS样式冲突、HTML结构和Bootstrap版本等方面的问题，并进行相应的调整和修复，以确保icon-bar类能够正确显示在Button中。
相关·内容
1回答
这种情况很奇怪。当我打开我的网站(建立在引导)的小屏幕上，导航条是可见的，但它应该是崩溃。当我点击按钮折叠，它仍然是可见的，当我点击第二次它是折叠刚才。从那以后效果很好。但是当我重新加载页面时，我仍然有这个问题。
<div class=container>
<!--MENU-->
<nav style="border-bottom:1px solid #000;">
<div class="navbar-header">
浏览 8提问于2016-01-18得票数 1
回答已采纳
2回答
我想：
如果扩展了菜单，则显示图像
显示文本-如果菜单被折叠(当"3行“按钮出现时)
这是我的代码：
<nav class="navbar navbar-idebaca navbar-fixed-bottom">
<div class="navbar-header">
<button type="button" class="navbar-toggle"
data-toggle="collapse" da
浏览 4提问于2014-06-27得票数 0
我正在试着在网站上显示工具条菜单。然而，它并没有出现。
应用程序代码：
appModule.config([
'$stateProvider', '$urlRouterProvider',
function ($stateProvider, $urlRouterProvider) {
// Default route (overrided below if user has permission)
$urlRouterProvider.otherwise("/home");
$stateProvider.state(&
浏览 3提问于2016-06-30得票数 1
3回答
我必须在导航栏中折叠内容。所有我想要显示这些内容在同一行(内联)。
<header class="navbar navbar-fixed-top" role="navigation">
<div class="navbar-inner">
<div class="container">
<button type="button" class="navbar-toggle" data-toggle="collapse"
浏览 5提问于2014-07-06得票数 0
我想要的按钮与三行作为一个独立的旋转木马图像保存的地方。打开切换按钮应该会像往常一样显示菜单。这是我的导航，显示了整个导航栏-条纹。
<nav class="navbar-default navbar-inverse">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar
浏览 0提问于2017-03-09得票数 0
1回答
我正在尝试使用引导图标栏“class=-bar”，但它没有显示在屏幕上。元素出现在屏幕中，但默认的高度和宽度显示为0。 我已经在Stack Overflow和不同的网站上提出了多个问题，但都没有帮助。 代码如下： </head>
<body>
<nav class="navbar navbar-default navbar-fixed-top bg-light">
<div class="containter">
<button type="butto
浏览 19提问于2019-12-06得票数 0
回答已采纳
1回答
小图标栏(三行的东西)不会显示在我的网站上，它在那里，但我认为它可能不对应于我的dreamweaver？Helppppppppp
<header role="banner">
<nav id="navbar-primary" class="navbar" role="navigation">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display --
浏览 2提问于2017-05-26得票数 0
2回答
我有一个下拉按钮和响应图像在同一行与下面的代码。
<div class="container dropdown ">
<a class="btn btn-primary dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
<span class="icon-bars-button">
<span class="ico
浏览 3提问于2016-10-10得票数 1
回答已采纳
我只是在导航栏()上学习了tutsplus课程。据我所知，我的代码与他的代码几乎完全相同，但我还是遇到了一些问题。如果我尝试使用元素创建一个按钮，后面的所有内容都会被推入一个新行。
<div class="navbar navbar-default" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button
浏览 0提问于2015-10-31得票数 0
1回答
当我打开图标栏(它出现在移动或放大)后，点击它，颜色会改变回默认。它不应该改变颜色后，取消悬停/鼠标。
以下是我网站的链接：
html：
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-controls="navbar">
<span class="sr-only">Toggle navigation</
浏览 3提问于2016-06-27得票数 0
回答已采纳
我在我的网站中使用bootstrap使其响应(我将进行自定义设计，而不是使用bootstrap的默认css)。我已经创建了一个bootstrap3导航栏，但缩小视口后出现的按钮不起作用，因为单击它时没有任何反应。我在stackoverflow上搜索过这个，甚至尝试合并中提到的更改。但它不起作用。在我的浏览器中启用了Javascript，我也在我的html中引用了bootstrap.js。
我的代码如下：
<div class="navbar navbar-default navbackcolor" role="navigation">
<
浏览 2提问于2014-06-04得票数 0
如何在bootstrap 3 (asp.net mvc项目)中居中显示如下导航栏和布局的页面
<div class="container center-block">
<div class="navbar navbar-default navbar-fixed-top bgnav">
<div class="container">
<div class="navbar-header">
<button type="bu
浏览 2提问于2014-05-28得票数 0
3回答
输入元素没有边距(引导)
、、、
我创建了一个问题的Fiddle (但是在Fiddle中它是正确显示的)。
如您所见，我有一个带有4个输入的表单。每当我在Webstorm上执行此操作时，该网站将以铬显示，但所有输入都没有空间(没有空间)。我将我的代码复制到jsfiddle中，它看起来是正确的。我想知道我是否在网络风暴中有一个错误，或者这是否是引导程序中的一个错误？这是一幅它看起来很正常的图片：
编辑(HTML代码)
<body>
<nav class="navbar navbar-inverse">
<div class="container"
浏览 5提问于2016-04-11得票数 0
回答已采纳
我一直在尝试让移动导航风格在台式机上工作，但我似乎无法让它工作。
我正在使用Bootstrap。我希望有一个单一的‘下拉’按钮，就像在手机上，显示导航项目。
这就是我在HTML中尝试的，让Bootstrap CSS保持不变：
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<button type="button"
浏览 2提问于2013-08-10得票数 0
我花了几天时间试图找出为什么下面的代码无法为页眉和页脚导航条找到/呈现mP_logo图像，但是该图像是在同一页上使用link_to image_tag("mP_logo_36x55.png")找到和呈现的。
顺便说一句，在另一个类似的应用程序中，同样的代码在导航栏中显示徽标没有问题。
报头
<nav class="navbar navbar-inverse navbar-static-top example6">
<div class="container">
<div class="navba
浏览 2提问于2017-06-21得票数 0
2回答
我希望在同一个导航条行上有两个可折叠的菜单。左边的菜单将显示网站的主菜单，而右边的菜单将显示“用户菜单”。
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="co
浏览 4提问于2013-09-05得票数 0
回答已采纳
1回答
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-na
浏览 3提问于2016-03-29得票数 0
回答已采纳
所以我有两个肚脐，第一个是倒的，另一个是默认的。两者都利用折叠按钮功能并正常工作，但默认导航栏中的功能没有显示。我的意思是，它在那里，但它是看不见的:这是我的密码：
<div class="container main-container">
<nav class="navbar navbar-static-top navbar-inverse navigation" role="navigation">
<button type="button" class="navbar-togg
浏览 1提问于2013-09-21得票数 1
回答已采纳
我想在没有包装在锚标签中的导航栏中显示文本。我找到的所有文档都只显示了类navbar-brand，这使得文本太大。我认为我可以简单地将文本放在<li></li>中并排除锚标记，但是当我这样做时元素会在导航栏中失去对齐。
下面是它显示的内容：
以下是代码：
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
浏览 2提问于2015-09-09得票数 0
回答已采纳
1回答
引导下拉列表位于导航栏下面。
、、、、
下面是下拉菜单出现时的样子。
Nav-bar :
<nav class="navbar navbar-default" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="
浏览 4提问于2015-12-19得票数 3
回答已采纳
1回答
这是我用来显示菜单的代码。正如您可能看到的，菜单项是图像而不是文本。我想要做的是恢复显示文本链接，而不是当您点击切换按钮移动和小屏幕设备的图像。我不知道！？
<nav class="navbar navbar-default header-sketch">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div cla
浏览 4提问于2016-09-16得票数 0
回答已采纳
1回答
我使用的是Bootstrap 3.0。在这里，我必须使用两个导航栏切换，我已经应用了一个条件，虽然它工作得很好，但这是一个很长的过程，因为我必须为两个导航栏做另一个css，我的代码如下。
对于导航栏1，我采用了以下代码
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"><
浏览 2提问于2013-10-10得票数 1
1回答
当我在我的Flask项目中使用bootstrap模板时，当我调试它时，我的网站上没有按钮。并且jquery版本是3.3.1min，引导版本是4min，Fig1是我的html，Fig2是期望的。我的导航按钮未在 中显示
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="c
浏览 21提问于2018-09-09得票数 0
回答已采纳
我已经使用span类图标栏显示三行符号后，调整窗口和其他组件应该显示在该图标下。但是当我调整窗口的大小时，它只显示了那个图标，点击它之后什么也没有发生，这就是我所做的:出了什么问题？提前谢谢你
<body>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<! Header -->
<div class="navbar-header">
浏览 1提问于2017-09-08得票数 1
回答已采纳
这里我的徽标显示了导航栏的下方，如何将其移动到导航栏并调整其大小？
以下是我的代码
代码：
<body>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" d
浏览 0提问于2018-05-26得票数 0
我正在学习使用twitter bootstrap。现在，我已经使用navbar-toggle折叠类成功地创建了一个下拉按钮。问题是每当我启动按钮的时候。它遮盖了下面的p元素，如下图所示：drop-down navbar button not activated drop-down navbar button expanded overshadowing the element below 我试过使用clear: left，但没有成功。下面是一个代码示例： <header>
<nav class="navbar-default navbar navbar-ex
浏览 8提问于2020-07-17得票数 0
我试图显示文字侧到标志，与以下代码，我能够显示在下一行后的标志。我试着搜索这个问题，但我仍然不明白我的问题是什么。我使用的是bootstrap 3.3.7v。
<nav class="navbar navbar-inverse" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class=&#
浏览 1提问于2017-08-09得票数 0
回答已采纳
3回答
如何在引导中启用切换按钮
、、、
当浏览器窗口是移动电话大小时，我需要显示navbar-toggle，当用户单击它时，我想显示一个列表(类似于这个)。
知道怎么修正我的代码吗？
<div class="container">
<!-- navbar -->
<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<div class="
浏览 3提问于2014-11-11得票数 2
回答已采纳
我使用下面的HTML代码创建了一个包含3个按钮(btn-navbar)的页脚。当导航栏折叠时，我可以正确地切换它，但按钮都显示在同一行中，而不是像<li>元素那样一个接一个地显示。
<!-- Fixed navbar bottom -->
<div class="navbar navbar-default navbar-fixed-bottom" role="navigation">
<div class="container-fluid">
<div class
浏览 0提问于2014-06-11得票数 4
回答已采纳
1回答
在这样的导航栏中：
当窗口变得足够小时，菜单项消失，出现3行按钮。我想知道发生这种情况时发生了什么变化。我特别想知道哪些类被添加到了什么中。我的代码如下所示，其行为类似于上面的链接。我已经使用了inspect元素，但我没有看到任何变化。谢谢!
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<b
浏览 1提问于2015-01-04得票数 1
1回答
我在玩一个Episerver网站。我使用的不是模板，只是一个空白的Episerver站点。
我创建了一个页面类型Ex。Startpage以编程的方式，我可以将它作为一个新页面添加到编辑视图中。因此，我的问题是如何使我创建的新页面显示在我的导航栏中？谢谢!
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
浏览 3提问于2016-03-17得票数 0
回答已采纳
我在我的asp.net mvc应用程序中有一个引导导航栏，我所要做的就是从导航栏菜单中将活动类更改为当前选定的元素。
通过使用以下jquery，我成功地实现了这一点：
$(document).ready(function () {
$('ul.nav.navbar-nav').find('a[href="' + location.pathname + '"]')
.closest('li').addClass('active');
浏览 0提问于2016-11-27得票数 1
1回答
启动菜单上的汉堡包菜单出现在wave.webaim.org网站的可访问性工具中，这是一个错误:按钮是空的，或者没有值文本。
对如何解决这个问题有什么建议吗？
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon
浏览 1提问于2017-01-09得票数 2
回答已采纳
1回答
我在WordPress中设计了一个新的主题。我使用引导菜单栏响应设计，但显示一个切换在桌面模式。
📷
<div id="nav">
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div c
浏览 0提问于2020-12-30得票数 0
我有一个menu.Please，如下所示
<nav role="navigation" class="navbar navbar-default">
<div class="navbar-header">
<button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle&
浏览 0提问于2014-07-23得票数 0
2回答
我有一个粘性的导航栏，我正在使用twitter bootstrap。每当我滚动经过某个点时，我的粘性导航栏就会显示出来，但当它显示出来时，我的内容就会跳起来。我想要的是我的内容停留在原地，而不是跳跃。
我的HTML
<body>
<div class="top_menu_wrapper">
<div class="toggle_wrapper">
<ul>
<li>
<div class="main_menu_header"
浏览 1提问于2015-04-22得票数 0
1回答
我在导航菜单中使用navbar类。当我使用类navbar-fixed-top时，身体上的一些内容隐藏在导航栏后面。有人能告诉我为什么会发生这种事吗？
下面是我一直在做的代码。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="
浏览 2提问于2014-04-15得票数 3
回答已采纳
2回答
我试图得到一个肚脐显示在一个网页的顶部，有一个干净的盒子内的水平按钮。非常类似于在找到的导航条。我觉得我应该知道该怎么做，但显然我不知道。任何帮助都是非常感谢的，甚至是要点和建议。谢谢，下面是我到目前为止的代码。Css首先显示，然后显示我的HTML。
body{
border: solid;
background-color: white;
color: black;
text-align: center;
}
table.slideshow{
}
th.slideshowtitle{
text-align: center;
}
footer{
border-
浏览 1提问于2016-05-25得票数 1
回答已采纳
5回答
首先，我想这是一个很好的例子，说明了如何使用Bootstrap实现多层次的导航栏(这是我长期以来一直在努力的事情)。
其次，我有一个关于防止内容在肚脐上崩溃的问题。
我的导航条有三行，两行默认和一条反行，以及三个按钮，用于在折叠时控制每个部分：
代码：
<nav class="navbar navbar-fixed-top">
<div class="navbar-default">
<div class="container">
<div class=&
浏览 4提问于2016-02-18得票数 8
回答已采纳
2回答
塌陷时不均匀的靴带药丸
、、、、
下面的代码在小屏幕或超小屏幕上显示时会产生宽度不等的“药片”(默认情况下由twitter引导程序定义)。
<header>
<div id="brand" class="container">
<div class="row">
<div class="col-sm-12">
<h1>Website</h1>
<h2>header<
浏览 3提问于2016-04-04得票数 0
回答已采纳
5回答
移动电话菜单:显示最后4个位置
、、、、
我正在使用引导框架。我的css文件中有以下代码：
@media (max-width: 768px) {
.navbar-default .navbar-nav > li > a {
width: 100%;
border-bottom: 1px solid #3d3d3d;
text-align: center;
}
HTML文件的一部分：
<nav class="navbar navbar-default">
<div class="container">
<!
浏览 6提问于2015-06-29得票数 0
回答已采纳
你好，我想在导航栏的右边创建一个区域。我使用了div类navbar- right，它应该将div向右浮动，但是我得到了一个新的行。
请看下面的代码&谢谢！
<div class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="na
浏览 0提问于2013-09-20得票数 14
回答已采纳
2回答
我正在与bootstrap的网站上工作，这是相对于导航栏的代码
<nav id="navi" role="navigation" class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" data-toggle="collapse" d
浏览 2提问于2014-06-09得票数 3
回答已采纳
1回答
我需要3个项目，只有在xs屏幕的下拉按钮中才可见。请查看代码并帮助我。这是该网页的链接：
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#collapsable-nav" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
浏览 1提问于2020-07-10得票数 0
我有一个问题，如何定位我的链接在肚脐塌陷。我希望左侧链接显示在折叠菜单的一行上，右侧链接显示在下一行。
现在，我可以使用css中的"display: inline“获得显示在同一行上的所有链接，但我不知道如何将它们分开。
下面是我当前的HTML和CSS：
<div class="container">
<nav class="navbar navbar-inverse">
<div class="navbar-header">
<button type="
浏览 3提问于2016-02-24得票数 0
回答已采纳
3回答
我使用引导来创建一个响应性的导航，我使用引导提供的一个图标来创建一个显示/隐藏菜单。问题是它在另一条线上显示箭头。是否有一种方式显示箭头旁边的文字在一行？
下面是一个演示：
下面是伴随着这把小提琴的代码，以使其自我包含：
<div class="container">
<div class="row">
<div class="col-sm-3 col-md-3 col-lg-2">
<div class="sidebar-nav">
<div class="
浏览 1提问于2014-08-18得票数 2
回答已采纳
在Bootstrap 3中，我试图创建一个导航栏，它将不得不ul，这两个都将对齐到右边。但是当我将navbar-right添加到两个ul中时，它们都是右对齐的，但是标记中的第二个ul首先显示?我需要做什么才能让它们以正确的顺序显示？
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="
浏览 16提问于2017-07-23得票数 1
回答已采纳
1回答
Bootstrap 3搜索条
、、、、
嗨，我正在尝试在一个标准的bootstrap 3模板中包含一个搜索栏。我试图以这样一种方式实现它:当菜单以较小的分辨率折叠时，搜索栏停留在导航栏中，其余的菜单按钮折叠。我让它在桌面分辨率下工作得很好，但当我切换到移动分辨率时，搜索栏就会显示在我的标题和导航按钮下面。这就是我目前正在使用的HTML。
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header"&g
浏览 0提问于2013-10-10得票数 3
回答已采纳
1回答
如何设置导航栏中链接的宽度(包括品牌名称)，使其宽度为960px并居中显示在页面中？我仍然希望导航栏的背景能够伸展到浏览器的整个宽度，并且仍然希望我的响应式按钮在折叠时能够正常工作。
我尝试了各种方法，但似乎不能让它工作。我是否需要将导航栏的背景与文本分开，并以某种方式将其居中？
这是我的HTML标记：
<div class="container">
<!-- row 1: navigation -->
<div class="row">
<nav class="navbar navbar-default nav
浏览 3提问于2013-10-18得票数 0
1回答
<nav role="navigation" class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<a href="" class="navbar-brand">Online Notes</a>
<butt
浏览 2提问于2018-03-11得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
