Tag: twitter bootstrap

Ruby on Rails Bootstrap Glyphicons无法正常工作: 我已经添加bootstrap到我的网站。这是我正在使用的结构。（我不能删除bootstrap.css文件，因为我修改了我的喜好）。 >app >>assets >>>fonts >>>>4 glypicons icon files. >>>images >>>>N/A >>>javascripts >>>>Bootstrap.js (Jquery is installed in a gem) >>>stylesheets >>>>Bootstrap.css 一切正常导入，但问题是，glyphicons不工作，我需要他们！

bootstrap-typeahead.js在select事件上添加一个监听器: 我是Bootstrap Twitter框架的新手，我需要使用bootstrap-typeahead.js来自动完成，但是我还需要获取用户为typeaheadselect的值。这是我的代码： <input type="text" class="span3" style="margin: 0 auto;" data-provide="typeahead" data- items="4" data-source='["Alabama","Alaska"]'> 我怎样才能添加一个侦听器来获取从键入typeahead选定的值，并将其传递给一个函数？例如，当我使用ExtJs时，我使用这种结构： listeners: { select: function(value){ …….. } } 我怎样才能做类似的事情？

为什么Bootstrap网格布局更适合HTML表格？: [注意：对于那些可能混淆这个问题的人来说，为什么不使用表格来进行HTML布局呢，我不是在问这个问题。我问的问题是为什么网格布局与表格布局根本不同。] 我正在研究一个项目的CSS库（特别是Bootstrap）。我是一名程序员而不是网页devise师，我觉得我可以从封装好devise的图书馆中受益。我们都知道，使用HTML表格来完成基本的网站布局是不好的做法，因为它将performance与内容混合在一起。像Bootstrap这样的CSS库提供的好处之一就是它们可以在不使用表的情况下创build“网格”布局。然而，我有一点麻烦，理解他们的网格布局与等效的表格布局有何不同。换句话说，这两个HTML例子之间的根本区别是什么？我错在认为网格布局是一个简单的另一个名称表？ <div class="row"> <div class="span16"></div> </div> <div class="row"> <div class="span4"></div> <div class="span4"></div> <div class="span4"></div> <div class="span4"></div> </div> 和 <table> <tr> <td colspan=4></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> </table>

用户代理样式表覆盖我的表格样式？ Twitter Bootstrap: 我正在使用twitter引导。我的问题是，表中的字体大小是错误的。出于某种原因，用户代理样式表正在覆盖引导表样式。在twitter引导页面（ http://twitter.github.com/bootstrap/base-css.html ），一切当然正常工作。在我的督察中，我看到以下不同之处：我的页面： twitter引导页面：所以绝对的问题是，用户代理样式表覆盖了引导样式。我一直无法弄清楚为什么这是不同的我的网页和twitter引导页面。大多数其他的CSS工作正常。我的CSS导入： <link href="/media/bootstrap/css/bootstrap.css" rel= "stylesheet"> 在twitter引导页上的CSS导入： <link href="assets/css/bootstrap.css" rel="stylesheet">

Bootstrap中的Grunt依赖冲突: 我已经从官方网站下载了Bootstrap源文件，并且在使用节点的npm安装项目时遇到依赖冲突。我在我的机器上安装了grunt 0.4.3 ，但是一些引导依赖需要0.4.0和0.4.1 。 npm install -g grunt-cli命令执行时没有任何问题。下面是执行npm install命令后得到的日志： npm ERR! peerinvalid The package grunt does not satisfy its siblings' peerDependencies requirements! npm ERR! peerinvalid Peer grunt-banner@0.2.1 wants grunt@~0.4.1 npm ERR! peerinvalid Peer grunt-contrib-clean@0.5.0 wants grunt@~0.4.0 npm ERR! peerinvalid Peer grunt-contrib-concat@0.3.0 wants grunt@~0.4.0 npm ERR! peerinvalid Peer grunt-contrib-connect@0.6.0 wants grunt@~0.4.0 npm ERR! peerinvalid […]

在执行多响应列时清除行 – 引导: 这个标题可能不是很准确，但这里是情况：正如你在HTML中看到的那样，网格系统从xl屏幕上的4个图像到 lg屏幕上的3 个图像，减less到2个。我试图让它正确显示 – 在每个屏幕大小的适当数量的图像，也就是说。然而，一些奇怪的事情正在发生，并不能使用引导类来弄清楚。在我看来，我将不得不在每个断点处dynamic添加行。有什么build议么？ – 更新 –只是意识到col-xl- *不存在。但是，这并没有改变这种情况。请忽略xl声明。 – 更新2 –更新的图像。 – 更新3 –我会尽力澄清我的目标。对于在我的文章中附加的特定图像，我想每行出现3个盒子 – 并不是所有的人都会出现问题。当它折叠成每行2个盒子（xs设备）时，我想确保每行都有2个盒子。

是否有可能使Font Awesome图标大于“fa-5x”？: 我正在使用这个HTML代码： <div class="col-lg-4"> <div class="panel"> <div class="panel-heading"> <div class="row"> <div class="col-xs-3"> <i class="fa fa-cogs fa-5x"></i> </div> <div class="col-xs-9 text-right"> <div class="huge"> <?=db_query("SELECT COUNT(*) FROM orders WHERE customer = '" . $_SESSION['customer'] . "' AND EntryDate BETWEEN '" . date('dM-y', strtotime('Monday this week')) . "' AND '" . date('dM-y', strtotime('Friday this week')) . "'");?> </div> <div>orders […]

使用bootstrap-datepicker检测所选date的更改: 我有一个使用bootstrap-datepicker创build的附加dateselect器的input元素。 <div class="well"> <div class="input-append date" id="dp3" data-date="2012-01-02" data-date-format="yyyy-mm-dd"> <input type="text" id="date-daily"> <span class="add-on"><i class="icon-th"></i></span> </div> </div> <script language="JavaScript" type="text/javascript"> $(document).ready(function() { $('#dp3').datepicker(); $('#date-daily').val('0000-00-00'); $('#date-daily').change(function () { console.log($('#date-daily').val()); }); }); </script> 当用户通过在input元素中直接input来更改date时，我可以使用input元素的onChange事件来获取值，如上所示。但是，当用户从datepicker更改date（即通过单击日历上的date），onChange处理程序不会被调用。如何检测通过dateselect器进行的所选date的更改，而不是通过在input元素中键入？

我如何实现一个触摸敏感，响应，可sorting的列表支持拖放Bootstrap？: 我有一个<ul>列表，我想进行sorting（拖放）。如何在现代浏览器和触摸设备上使用Bootstrap 3？我试图使用jqueryuisorting与http://touchpunch.furf.com/ ; 它似乎工作，但它是hacky和jQueryUI不能很好地与Bootstrap。如何在添加触摸屏支持时避免Bootstrap / jQueryUI冲突？

改变FontAwesome图标的字体重量？: 我想让其中一个FontAwesome图标重一点 – 它比我使用的字体重得多。这看起来如何：：丑，对吗？所以我尝试重置字体重量如下： .tag .icon-remove { font-weight: 100; } 该属性似乎在CSS中正确设置，但它没有效果 – 图标看起来像以前一样重。我也尝试过font-weight: lighter和-webkit-text-stroke-width: 1px ，没有任何效果。有什么办法可以让图标不那么沉重？该文档说：“ 任何你可以用CSS字体样式，你可以做Font Awesome ”，但我不知道如何做到这一点。