程序员经验分享-hwhale

如何在流体宽度容器中将左侧、中间和右侧的三个按钮放置在同一行？

2024-04-28

我在用着LESS在 Twitter Bootstrap 环境中，但我会直接接受CSS也有答案。

| Fluid-width container                            |
|                                                  |
| [Btn1]               [Btn2]               [Btn3] |
|                                                  |

另一种宽度：

| Fluid-width container                |
|                                      |
| [Btn1]         [Btn2]         [Btn3] |
|                                      |

在我看来，您可以使用如下的库存引导环境来做到这一点：

<div class="row-fluid">
  <div class="span4 text-left"><a href="#" class="btn">Btn1</a></div>
  <div class="span4 text-center"><a href="#" class="btn">Btn2</a></div>
  <div class="span4 text-right"><a href="#" class="btn">Btn3</a></div>
</div>

这使得三个<div>是组成 bootstrap 的十二列网格的 span4 列。

您不需要添加任何额外的 CSS，因为这些 .text-left、right 和 center 类随 bootstrap 一起提供。

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

css

twitterbootstrap

Less

如何在流体宽度容器中将左侧、中间和右侧的三个按钮放置在同一行？ 的相关文章

  • 将 Angular Material 与 Twitter Bootstrap 相结合，不会发生冲突

    我想将 Twitter Bootstrap 与 Angular 材料结合起来 我发现引导材料设计https github com FezVrasta bootstrap material design https github com Fe

  • application.css 未作为资产提供

    编辑4 5和6 8小时后 欢迎任何更多的想法 也许这个错误已经被知道并解决了 但是当你在 app assets stylesheets 的 css erb 文件中有这个时 我得到了我在编辑 2 3 中描述的行为 li background

  • 突出显示 Html 文档中不同标签的文本

    我是新来的角js 现在我正在突出显示 HTML 文档中的文本 So 我的代码是这样的 var InstantSearch highlight function container highlightText var internalHigh

  • Bootstrap 4：卡片作为具有相同高度和宽度的网格

    我正在尝试在具有相同高度和宽度的网格中订购卡片 这些卡片将有不同的内容和不同的尺寸 每行也应该有 3 个 每行的高度可以不同 但 行内的高度应该相同 整个网格中每张卡片的宽度应该相同 div class container div clas

  • 检测 iPad Safari 用户的最佳方法

    添加用于检测 iPad Safari 用户的代码的最佳方法是什么 我的意思是我们应该使用 1 CSS 通过链接媒体 2 JS 通过navigator对象 我听说使用用户代理字符串并不是检测 iPad 的最佳方法 因为存在不一致的情况 请建议

  • 防止 Bootstrap IE 下拉列表在滚动条单击时关闭

    在 IE 中 单击下拉菜单滚动条时 下拉菜单将关闭 当您使用鼠标滚轮滚动它时 效果很好 这是代码层链接 https www codeply com go Uh8qadr3q2 https www codeply com go Uh8qadr

  • jQuery - 动画CSS背景大小？

    我正在尝试对背景图像的大小进行动画处理 但它不起作用 从以下代码中知道为什么吗 this animate opacity 1 background size 70px 48px right 39 top 45 250 注意 所有其他属性都可

  • Iphone safari 无法在键盘打开时调整视口大小

    当键盘弹出时 Mobile safari 不会更新 window innerHeight 至少在9 3 5中 并且有几个答案 例如this https stackoverflow com a 17604856 2423187一 有评论说在

  • 具有动态调整大小的 CSS 精灵

    我决定为我的整个网站 30 个图像 创建一个精灵表 这样我就可以加载 1 个图像并仅加载参考位置 从而减少图像加载时间和服务器调用 我的问题 是否可以引用 sprite 表中的图像 然后将该图像调整为其父容器的 100 例如 SomeDiv

  • 表格内的垂直滚动条不显示：块

    有没有办法在里面有一个垂直滚动条 tbody 一张桌子并有display table放在桌子上但不使用display block桌子内的任何地方 对于滚动条部分 将其添加到要滚动的标签中 style overflow y scroll tb

  • border-box 不适用于内联块元素？

    我有一个清单inline block元素 我想为您将鼠标悬停在其上的元素添加边框 但是 请注意边框如何偏移元素 即使我使用box sizing border box并明确定义元素的宽度和高度 我说明了以下行为 box sizing bord

  • 如何制作像图像中那样精确的 CSS3 线性渐变？

    For example this is gradient which I want to make in CSS3 我可以使用 1 px 图像剪切并在 x 轴上重复 就像我们之前所做的那样 但现在如果我想使用 CSS3 制作同样精确的渐变

  • CSS - 制作“步进”文本的好方法？

    有没有一种好的方法可以实现以下目标 而无需任何额外的标记 不过使用 JavaScript 就很好了 任何想法 Thanks Edit 我的标记将是这样的 div style width 400px p Text text text Text

  • HTML：您可以隐藏/忽略浏览器查找中的文本元素 (CTRL+F)

    我有一个具有相当复杂的 UI 的 Web 应用程序 并且屏幕的一部分保留用于内容 如果可能的话 我想这样做 以便当用户使用浏览器的内置文本搜索 CTRL F 时 UI 中的任何文本都将被忽略 并且仅搜索实际内容 这可行吗 CSS 和 Jav

  • 在模态上自动滚动引导模态（'show'）

    我有一个用于评论的引导模式 评论表格附加在评论列表的底部 我希望此模式在打开时滚动到列表底部 如果有超过 2 或 3 条评论 我已经安装了这个幻灯片插件 http jesseprice com jquery slide to plugin

  • 如何使用 jQuery Validate 正确验证放置在多个选项卡上的 Twitter Bootstrap 表单？

    我有一个表单位于多个 Twitter 的 Bootstrap 选项卡上

  • 使用“SVG 多边形”悬停状态在“SVG”之后淡入 div

    有没有一个只用CSS来解决这个问题的方法 我希望能够在 SVG 之后淡入 div 但前提是用户将鼠标悬停在 SVG 多边形上 代码看起来像这样

  • 为什么媒体查询中的 CSS 旋转不会旋转回来

    我有一个 SVG 其中一些元素根据媒体查询进行旋转 如下所示 media max width 480px rect transform rotate 10deg 该元素旋转得很好 但 至少在 Chrome 中 它拒绝返回 这是为什么 其他指

  • min-height 和 height 属性有什么区别？ [复制]

    这个问题在这里已经有答案了 我查了一下这个问题 但无法理解它与我的具体问题的关系 我将有问题的 html 设置如下 div class container fluid div class inner div class weatherdat

  • 猫头鹰轮播，制作自定义导航

    所以我有一个包含三张图像的猫头鹰旋转木马 我还在左侧和右侧添加了自定义导航箭头 png 图像 然而 这些箭头目前是无用的 因为我找不到一种方法来真正让它们在我的猫头鹰旋转木马的图像之间切换 我无休止地寻找 找不到解决方案 有任何想法吗 您需

随机推荐

  • 纱线堆的使用量随着时间的推移而增长

    我们在 AWS EMR 上运行 Spark Streaming 作业 该作业将稳定运行 10 到 14 小时 然后崩溃 并且 stderr stdout 或 Cloudwatch 日志中没有明显错误 在此崩溃之后 任何重新启动作业的尝试都将

  • 在运行时在 iOS 上添加框架

    首先 我将描述我的用例 说明为什么我需要在 iOS 上运行时添加框架 假设我在 iOS 设备上有一个应用程序 该应用程序需要一些第三方框架来添加一些外部功能 现在 功能有很多 所以 所需的框架数量也会很多 用户可能不需要很多功能 只是一小部

  • 重新格式化 csv 文件

    我有这个 csv 文件 其中只有两个条目 这里是 Meat One Abattoirs Exporters Food Delivery Butchers Retail Meat Dealers Retail Meat Freezer Mea

  • R语言赋值

    我想知道 R 语言中的赋值是如何工作的 考虑以下 R shell 会话 gt x lt c 5 6 7 gt x 1 lt 10 gt x 1 10 6 7 gt 我完全理解 创建向量 5 6 7 并将其绑定到 符号 x 之后 x 会反弹到

  • Objective-C 类别导致无法识别的选择器

    我的项目有一个UIImage我想从另一个类调用的类别函数 我正确导入了图像类别的头文件 并且在没有警告的情况下编译了项目 问题是当我打电话时UIImage类别函数我看到一个无法识别的选择器错误NSInvalidArgumentExcepti

  • 缺少 /var/lib/mysql/mysql.sock 文件

    我正在尝试访问 mysql 当我运行 mysql 命令时 我得到以下信息 root ip 10 229 65 166 tpdatabase 1 8 0 28356 mysql 错误 2002 HY000 无法连接到 通过socket本地My

  • 如何在 NavHostFragment 中检索当前片段？

    我试图在新的导航组件中找到一种方法 但我没有找到任何相关内容 我当前的目的地是 mainHostFragment findNavController currentDestination 但我无法获得对显示片段的任何引用 参考显示的片段 A

  • 仅使用 fprintf 和 fscanf 替换文本文件中的字符串

    抱歉问这么简单的问题 这是我作业的一部分 我被困住了 如你看到的 include

  • Spring中需要多个相同类型的bean

    将其标记为重复之前的请求 我浏览了论坛 但在任何地方都找不到该问题的解决方案 我正在使用 Spring 3 2 编写代码 一切都是纯粹基于注释的 该代码接收从不同 XSD 文件派生的 XML 文件 所以我们可以说 有五个不同的 XSD A1

  • 在 Python 中使用 argparse 处理无效参数

    我在用argparse https docs python org 2 library argparse html解析命令行参数 默认情况下 在收到无效参数时 它会打印帮助消息并退出 是否可以自定义 argparse 在收到无效参数时的行为

  • Nonetype 错误/使用 python 的 beautifulsoup 没有打印任何元素

    所以我尝试使用 python 比较 2 个列表 其中一个包含我从网站获取的 1000 个链接 另一个包含一些单词 这些单词可能包含在第一个列表的链接中 如果是这种情况 我想得到一个输出 我打印了第一个列表 它确实有效 例如 如果链接是 ht

  • Powershell CMD.exe 和路径中的空格

    我在使用执行命令时遇到问题cmd exe在 PowerShell 中 问题是命令的路径中有空格 似乎是 PowerShell 的普遍问题 以下是摘录 base dir resolve path this path has spaces in

  • 有没有办法查看 Docker for Windows 上的容器磁盘使用情况？

    我很好奇除了作为容器映像一部分的层之外 是否还有一种方法可以查看正在运行的 Windows 容器使用了多少磁盘空间 基本上 容器自创建以来 增长 了多少 在 Linux 或在 HyperV 中运行的 Linux 容器 中 这将是docker

  • 熊猫在移动的数据帧上滚动

    这是一段代码 我不明白为什么在最后一列 rm 5 上 前 4 项得到 NaN 我知道对于 rm 列 前 4 项未填充 因为没有可用数据 但如果我移动列计算 应该进行 不是吗 同样 我不明白为什么 rm 5 列中有 5 个而不是 4 个项目是

  • AWS 上的多租户应用程序 - 多个 SSL 证书安装策略

    我正在为 Rails 多租户应用程序做一些规划 并且想知道处理自定义域证书的最佳方法是什么 应用程序是相当沼泽标准 ELB 应用程序服务器和多租户数据库 在我当前的用例中 每个租户都有一个自己独有的应用程序子域 这通常是通过通配符证书来处理

  • 使用 UIWebView loadRequest 的常规块 56、1024、8、244、24 内存泄漏

    我遇到了内存泄漏 但无法通过泄漏 构建 分析或整体检查来找出如何修复 我有一个非常强烈的想法 这是由于我的 UIWebview 加载 JavaScript 的 loadRequest 命令造成的 但我不知道出了什么问题 这是我的设置 我有一

  • Android WebView - 带有经过身份验证的代理

    我目前正在尝试调试围绕 WebView 构建的 Android 应用程序 我负责处理的开发网络环境 不是我的选择 这是 企业 安全决策 是WPA WiFi 代理服务器 代理身份验证 虽然a上的说明以前的答案非常有帮助 https stack

  • 在通用 C# 类中链接隐式运算符

    对于以下通用 C 类 我想将 T 转换为 K public abstract class ValueType

  • 哪种 jQuery 选择方法更快？

    我想知道使用 jQuery 进行选择时使用上下文参数与使用普通 CSS 范围选择器相比是否有任何优势 假设我有这个 html div class contacts h1 All contacts h1 div class contact n

  • 如何在流体宽度容器中将左侧、中间和右侧的三个按钮放置在同一行？

    我在用着LESS在 Twitter Bootstrap 环境中 但我会直接接受CSS也有答案 Fluid width container Btn1 Btn2 Btn3 另一种宽度 Fluid width container Btn1

热门标签