Tag: twitter bootstrap 3

Bootstrap 3 + Rails 4 – 某些Glyphicons无效: 我想在我的rails 4应用程序中使用bootstrap 3。在本教程中，使用这个 github页面的bootstrap saas来设置bootstrap 3。 Bootstrap工作正常，但glyphicons没有按预期工作。某些glyphicons根本不显示。例如，我厌倦了在我的application.html.erb中显示一些testing： glyphicon glyphicon-floppy-disk -> <span class="glyphicon glyphicon-floppy-disk"></span> </br> glyphicon glyphicon-plus -> <span class="glyphicon glyphicon-plus"></span> </br> glyphicon glyphicon-minus -> <span class="glyphicon glyphicon-minus"></span> 图标呈现像这样软盘图标根本不显示（显示无效的文字）正和负的sigs不是粗体，比bootstap网站上显示的小。我也在轨道控制台上看到以下消息。 Started GET "/fonts/glyphicons-halflings-regular.woff" for 127.0.0.1 at 2014-02-22 16:29:54 -0800 ActionController::RoutingError (No route matches [GET] "/fonts/glyphicons-halflings-regular.woff"): Started GET "/fonts/glyphicons-halflings-regular.ttf" for 127.0.0.1 at 2014-02-22 […]

从右到左支持Twitter Bootstrap 3: 之前一直存在这样的问题：支持RTL语言的Twitter Bootstrap CSS 但所有的答案都适合Bootstrap 2.x 我正在做一个阿拉伯文（rtl）的项目，我需要从右到左的Bootstrap 3.x。有谁知道这个问题的解决办法吗？

在引导弹窗内包含表单？: <div class="container"> <div class="row" style="padding-top: 240px;"> <a href="#" class="btn btn-large btn-primary" rel="popover" data-content="<form><input type="text"/></form>" data-placement="top" data-original-title="Fill in form">Open form</a> </div> </div> 的jsfiddle 我猜我会将表单内容存储在一个javascript函数中… 如何在自举popover中包含表单？

将Bootstrap更新到版本3 – 我该怎么做？: 我是Bootstrap的新手，并且具有旧版本2.3.2。版本3已经发布。如果我想使用最新版本，我只需简单地replaceCSS和Javascript文件？

引导堆叠行中的差距: 我正在构build一个Bootstrap 3网格，最终将成为一个组合页面。在下面的例子中，在第一个例子中，你可以看到它在我的bootply中完美地从6堆栈到4堆栈到3 堆栈然而，在第二个例子中，在同一个bootply中，有一个项目，其中项目的瓷砖更长，并在堆叠时导致网格中的空隙。什么是最好的引导友好的解决scheme？任何帮助非常感谢。

单击closures时保持引导程序下拉菜单打开: 如果下拉列表可见，并且在closures的下拉列表之外单击。我需要它不closures。从文档：打开时，插件还会添加.dropdown-backdrop作为单击区域，以在菜单外单击时closures下拉菜单。我可以添加什么JavaScript来防止closures下拉菜单？

Bootstrap 3.1中使用的.map文件是什么？: 有两个文件包含在带有.map文件扩展名的CSS文件夹中。他们是： bootstrap-theme.css.map bootstrap.css.map 他们似乎是缩小的文件，但我不知道他们是什么。

Bootstrap 3使用Chevron图标折叠显示状态: 使用从Bootstrap 3 Javascript 示例页面获取的关于Collapse的核心示例，我已经能够使用V形图标显示崩溃的状态。我有这个工作使用： $('#accordion .accordion-toggle').click(function (e) { var chevState = $(e.target).siblings("i.indicator").toggleClass('glyphicon-chevron-down glyphicon-chevron-up'); $("i.indicator").not(chevState).removeClass("glyphicon-chevron-down").addClass("glyphicon-chevron-up"); }); 这工作（没有在所有浏览器中完全testing），但我想知道是否有一个更优雅的解决scheme呢？理想情况下，我想使用核心function，但我不知道如何实现相同的结果。 $('#accordion').on('hidden.bs.collapse', function () { //do something… }) 这是jsfiddle中的一个工作版本。

Bootstrap：如何堆叠不同高度的div？: 这个问题有点类似于这个，但是我想知道是否有一个与Bootstrap兼容的纯CSS解决scheme。基本上，我有以下布局：这是该网页的HTML： <div class="menu row"> <div class="menu-category list-group col-lg-3 col-md-4 col-sm-6 col-xs-12"> <div class="menu-category-name list-group-item active">Category</div><a href="#" class="menu-item list-group-item">Lorem ipsum.<span class="badge">€ 0.00</span></a> <a href="#" class="menu-item list-group-item">Lorem ipsum.<span class="badge">€ 0.00</span></a> <a href="#" class="menu-item list-group-item">Lorem ipsum.<span class="badge">€ 0.00</span></a> <a href="#" class="menu-item list-group-item">Lorem ipsum.<span class="badge">€ 0.00</span></a> <a href="#" class="menu-item list-group-item">Lorem ipsum.<span class="badge">€ 0.00</span></a> <a href="#" class="menu-item […]

当地址栏隐藏iOS / Android / Mobile Chrome时，背景图像跳转: 我目前正在使用Twitter Bootstrap开发一个响应式网站。该网站在手机/平板电脑/桌面上具有全屏幕背景图像。这些图像旋转和淡入每个使用两个div。除了一个问题，这几乎是完美的。在Android上使用iOS Safari，Android Browser或Chrome时，当用户向下滚动页面并隐藏地址栏时，背景会略微跳跃。该网站在这里： http : //lt2.daveclarke.me/ 在移动设备上访问它并向下滚动，您应该看到图像resize/移动。我用于背景DIV的代码如下所示： #bg1 { background-color: #3d3d3f; background-repeat:no-repeat; background-attachment:fixed; background-position:center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position:fixed; width:100%; height:100%; left:0px; top:0px; z-index:-1; display:none; } 所有的build议欢迎 – 这一直在做我的头一阵子！