Bootstrap 导航栏边距

2023-12-31

我想让导航栏内容的左右边距变小,以便“品牌”(最左侧的组件)在左侧显示得比默认值更多,右侧组件的情况也是如此。

有人可以指出我要修改的相关较少变量吗?

Thanks


对于基本布局,您想要的 CSS 选择器是

body > .navbar .brand

尝试使用 margin-left 和 margin-right,直到获得所需的结果。根据您调用 CSS 样式的方式,您可能还需要添加 !important,例如

body > .navbar .brand{
margin-left:-20px !important;
margin-right:-20px !important;  
}

如果您没有成功,请尝试忽略身体 >

EDIT

如果您想更改整个导航栏的宽度,请尝试类似的操作

.navbar{
margin-left:-20px;
margin-right:-20px;
}

您可能还需要调整 navbar-inner 的详细信息,例如

.navbar-inner{
padding-left:0;
padding-right:0;
}  

Edit
看看这是否有帮助:http://jsfiddle.net/panchroma/zBeZF/ http://jsfiddle.net/panchroma/zBeZF/

祝你好运!

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Bootstrap 导航栏边距 的相关文章

  • ajax 请求后无法显示 twitter bootstrap 模式

    我想在单击链接时显示模式窗口 但也想执行 ajax 请求来获取需要在模式窗口上显示的对象 我收到了需要在模态窗口上显示的内容的响应 但它没有弹出 因为模态窗口可能是脚本没有被执行 Code 主页 div div JavaScript 代码
  • select2 MULTIPLE 占位符不起作用

    我正在使用以下代码来选择项目 但占位符已经不可见 我正在使用这个例子select2 引导程序 http fk github io select2 bootstrap css div class form group style width
  • Morris.js 图表在引导选项卡内无法工作

    我遇到一种情况 我尝试在两个不同的内部使用 MorrisJS 图表引导选项卡 http getbootstrap com javascript tabs 图表在第一个 默认 选项卡中加载良好 但当我单击第二个选项卡时 图表根本无法正确加载
  • 如何更改 bootstrap 版本 4 按钮颜色

    我可以通过更改 bootstrap v4 中的主题颜色来更改主按钮颜色 但它也会影响所有其他组件 如何设置主按钮颜色而不影响主题颜色 我不想设置品牌为主并实现它 还有其他选择吗 Bootstrap 4 1 2019 年更新 现在 Boots
  • angular.js ng-repeat 用于创建网格

    我正在尝试使用 bootstrap 3 和 angularjs 创建一个网格 我试图创建的网格是这样的 使用 ng repeat 重复 div class row div class col md 4 item div div class
  • 数据表中的按钮和分页显示不正确

    我正在使用数据表 https datatables net 显示报告和记录 但我遇到一个问题 文件导出按钮和底部的分页仅显示为链接而不是按钮 这是我的屏幕截图 这是我在我的页面中加载的内容
  • 将 div 元素放置在响应式背景上(Bootstrap 3)

    我想将 div 输入表单 放置在响应式背景上 我使用 Bootstrap 3 作为页面模板 但是 如果我调整窗口大小或使用其他屏幕尺寸 则元素位于另一个位置 我该如何解决这个常见问题 Example http goo gl D7TwIP h
  • 在单引导模式上显示图像

    我正在执行一项任务 我需要很少的图像 并且我想在引导模式中显示图像 我已经完成了下面的代码 以便在单击链接时在模态上显示图像 其中链接具有以下图像 每个图像都有链接 模态与所有图像一起打开 但问题是我不想为每个图像创建模态
  • 使用小屏幕时强制在按钮文本内换行

    我有一个响应式网络应用程序 其中包含一些对于小移动屏幕来说太大的按钮 它们包含太多文字 因此最终会从屏幕上消失 我目前正在使用a通过给它们引导类来标记为按钮 所以目前的代码是这样的 a Here I have a button with l
  • Bootstrap 4 中导航栏重叠内容

    我的作品集页面有一个粘性导航栏 但是当我单击导航栏链接时 它会与每个部分中的文本重叠 在大约中 它与文本重叠 在 投资组合 和 关于 中 它与两个图块重叠 我试图在每个部分用一些填充顶部来补偿 但无济于事 这是完整的导航栏
  • Bootstrap 将图像与文本对齐

    我正在尝试使用引导程序将左侧的图像与文本对齐 并且当在移动设备上查看页面时 图像将居中于文本顶部 div class container div class row h1 About Me h1 div class col md 4 div
  • 模态内的引导程序表单未正确对齐

    我尝试使用引导程序 水平形式 制作模式形式 并且该字段显示在标签下 知道如何修复它 以便输入文本框位于标签的右侧而不是标签的下方吗 div class modal hide fade div class modal header div d
  • ng-bootstrap ngbDropdown 在 Angular 4 中不起作用

    在我的 Angular 4 应用程序中 ng bootstrap 中的 ngbDropdown Element 不起作用 对于这种情况 我安装了以下 npm 模块 ng bootstrap ng bootstrap 1 0 0 alpha
  • 使用 Bootstrap 3 具有固定高度、标题和列宽度的表格

    我想要一张具有以下功能的表 固定标题 固定高度 带有可见的滚动条 3个固定宽度的列 一个大列和两个窄列 我开始使用 tbody display block overflow auto height 100px 为了至少获得固定高度 但此规则
  • 仅当显式选择行时才关闭 ui-bootstrap typeahead

    我创建了这个jsBin http jsbin com livuqafe 2 edit来证明我遇到的问题 如果您转到此处 请尝试输入 五 并继续 你的自然反应是输入 五 然后按 Tab 如果你想要 五百 你可以向下箭头一次 但是 在这种情况下
  • Capybara-webkit 无法处理与 bootstrap glyphicon 的链接

    我有一个链接 link to q span class glyphicon glyphicon trash span html safe feed item data confirm Are you sure toggle tooltip
  • Draggable JS Bootstrap 模式 - 性能问题

    对于工作中的项目 我们在 JavaScript 中使用 Bootstrap Modal 窗口 我们想让一些窗口可移动 但我们遇到了 JQuery 的性能问题 myModal draggable handle modal header Exa
  • CakePHP 与 Bootstrap(来自 Twitter)

    我是 CakePHP 的新手 我想知道一种在与蛋糕结合的布局中使用 Twitter 的 Bootstrap 的方法 我主要关心的是让 Form Helper 继续正常运行 因为我认为它使用预先配置的 CSS 类 如果我更改默认的 css 我
  • 如何设置引导开关的 css 颜色?

    如何在此引导开关中将蓝色更改为另一种颜色 我尝试更改输入元素的颜色和背景颜色 但它没有更改开关颜色 这是 html 和 bootstraplink https getbootstrap com docs 4 2 components for
  • 如何在 Bootstrap 列中使用文本溢出?

    假设我有一行具有固定高度 并且我在其列中插入了一些文本 如果太长 我希望将其剪掉 并在行尾添加三个点 如下所示 我在用着文本溢出 省略号 我的行中有此属性 但无法使其工作 JsFiddle http jsfiddle net Alexnot

随机推荐

  • 为什么 UserPrincipal.FindByIdentity 返回有关 GUID 为 32 位的错误?

    我的应用程序使用UserPrincipal类来确定用户属于哪些组 然后使用该信息来确定用户是否经过身份验证才能使用我的应用程序 有一段时间一切都很好 但最近我开始遇到异常 Guid 应包含 32 位数字和 4 个破折号 xxxxxxxx x
  • SQL 和 C# 中两个日期计算之间的日期差异产生不同的结果

    我正在计算两个日期的日差 在 C 中 diffdays EndDate StartDate Days 因此 考虑到结束日期为 6 26 2015 开始日期为 6 10 2015 diffdays 值为 15 如调试时的 自动 部分所示 在
  • 在 WordPress 中缓存自定义社交分享计数

    我真的很喜欢有一个股票柜台在我的博客文章上 我注意到它实际上鼓励访问者自己分享内容 因为没有真正令我满意的 WordPress sharecount 插件 其中大多数都需要大量调用 所以我自己编写了代码 它工作完美 但仍然减慢了我的网站速度
  • JavaScript - 我如何了解“闭包”的用法?

    维基百科 自由的百科全书 闭包 计算机科学 在计算机科学中 闭包是 在中评估的函数 环境包含一个或多个 绑定变量 当被调用时 函数可以访问这些变量 闭包的显式使用是 与函数式编程相关 以及诸如 ML 和 口齿不清 诸如以下对象的构造 其他语
  • 在 Electron 中处理表单的正确方法是什么?

    表单 html 和提交事件是 渲染器 的一部分 提交的数据应该在主流程中可用 提交表单并使数据可在 main js 中访问的正确方法是什么 我应该简单地使用 远程 模块将数据传递到 main js 中的函数还是有更好的方法 我们使用服务 A
  • MySql中如何使用触发器制作外键

    我想使用触发器在MySql中创建外键 我有以下表格 1 内容 表 教师 ID varchar 20 子 ID varchar 20 路径 varchar 100 文件名 varchar 100 2 老师 表 教师 ID varchar 20
  • 如何向我的班级用户表明验证要求?

    我正在实现一个类 该类使用非常严格定义的模式封装 xml 文档 我不控制架构 类中的属性之一用于模式指示必须与特定正则表达式匹配的元素值 在属性的设置器中 如果字符串与表达式不匹配 我将引发异常 我的问题是 如何才能更好地向我班级的用户传达
  • 如何将 Visual Studio 2019 中的 .NET 版本更改为 .NET Framework 4.7.2?

    我怎样才能将 NET更改为 NET Framework 4 7 2 我已经两天了 真的很挣扎 我正在做一个 WinFormApp 只能使用 NET 5 或 NET Core 3 1 但我需要 NET Framework 4 7 2 作为另一
  • 反应式闪亮模块共享数据

    我正在尝试使用模块创建一个闪亮的应用程序 两个数据帧 表 a 和 b 是反应性的并且可以修改 第三个数据帧 表 c 也是反应性的并且基于表 a 和 b 我尝试按照这个question https stackoverflow com ques
  • PayPal IPN 意外变化

    从 2017 年 3 月 8 日左右开始 我们注意到一些 不是全部 PayPal IPN 出现了一些异常行为 PayPal 似乎正在推出某种变化 还有一些其他人报告了其他事情 例如 PayPal 从 IPN 端点中删除的 QueryStri
  • std::unordered_set 元素的迭代顺序是否保证始终相同?

    如果迭代的元素std unordered set多次而不更改集合的内容 但可能从中读取 计算其大小等 是否保证每次都会以相同的顺序访问元素 在你提到的具体情况下 是的 因为该标准明确规定了何时进行重新散列 并因此重新排序 它仅在插入期间发生
  • C# Random 不像 random 那样工作

    我有一个图 每个节点有 4 个子节点 我编写了一个算法来生成从开始节点到结束节点的随机路径 在每个节点 它选择一个随机的下一个节点 访问过的节点可以重新访问 代码如下 public List
  • Cuda 中未找到 HANDLE_ERROR 错误

    global void add int a int b int c c a b int main void int c int dev c HANDLE ERROR cudaMalloc void dev c sizeof int add
  • Sunspot / Solr / Rails:模型关联未在索引中更新

    我的应用程序中有一个 Fieldnote 模型 它通过名为 fieldnote activities 的表附加了 many activities 然后我这样定义一个可搜索索引 searchable auto index gt true au
  • 如何让 ASP.NET Web API(自托管)在 *仅* 本地主机上侦听?

    我正在按照这个例子here http www dotnetcurry com ShowArticle aspx ID 896用于自托管 ASP NET Web API 服务 但是 当在基地址中指定 localhost 作为主机时 它会被转换
  • 系列的第 n 项

    我们必须找到这个级数的第n项http oeis org A028859 http oeis org A028859 n 答案应该以 1000000007 为模 我已经编写了代码 但是当 n a 是一个巨大的数字时 时间限制就超出了 incl
  • 其他同步方法

    除了使用synchronized关键字之外 如何在java中同步方法 你可以使用java util concurrent locks封装 特别是Lock接口 Lock l l lock try access the resource pro
  • 在图像控制中以 5 秒时间间隔显示文件夹中的所有图像

    我有一个包含 1000 张图像的文件夹 图像名称的顺序为 ICON000 ICON001 直到 ICON 999 我需要它们以 5 秒的时间延迟按顺序显示在我的 WPF 图像控件中 我使用文件对话框来获取特定文件夹的路径和图像的相应前缀 图
  • JavaScript ES6 类可以与异步代码库一起使用吗?

    什么可以ES6 类 https developer mozilla org en US docs Web JavaScript Reference Classes作为一种组织模式 提供异步代码 下面是一个 ES7 async await 的
  • Bootstrap 导航栏边距

    我想让导航栏内容的左右边距变小 以便 品牌 最左侧的组件 在左侧显示得比默认值更多 右侧组件的情况也是如此 有人可以指出我要修改的相关较少变量吗 Thanks 对于基本布局 您想要的 CSS 选择器是 body gt navbar bran