Tag: twitter bootstrap

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 […]

如何在ASP.NET MVC中将“活动”类添加到Html.ActionLink: 我想添加一个“活跃”的类到我的启动navbar在MVC，但下面不显示活跃的类，当这样写： <ul class="nav navbar-nav"> <li>@Html.ActionLink("Home", "Index", "Home", null, new {@class="active"})</li> <li>@Html.ActionLink("About", "About", "Home")</li> <li>@Html.ActionLink("Contact", "Contact", "Home")</li> </ul> 这解决了什么看起来像格式正确的类，但不起作用： <a class="active" href="/">Home</a> 在Bootstrap文档中，它指出'a'标签不应该在导航栏中使用，但上面是我相信是向Html.ActionLink添加类的正确方法。有另一种（整齐）的方式，我可以做到这一点？我在学习ASP.NET MVC的早期阶段，所以我很抱歉如果我错过了一些明显的东西！

Twitter引导模态背景不会消失: 我正在使用Twitter引导模式对话框。当我点击引导模式对话框的提交button时，它发送一个AJAX请求。我的问题是，模态背景并没有消失。 modal dialog确实消失，但是在屏幕上创build不透明度的“模态背景”仍然保留我能做什么？

Angular ng-repeat每3或4列添加bootstrap行: 我正在寻找正确的模式，每3列注入一个引导行类。我需要这个，因为cols没有固定的高度（我不想修复），所以它打破了我的devise！这是我的代码： <div ng-repeat="product in products"> <div ng-if="$index % 3 == 0" class="row"> <div class="col-sm-4" > … </div> </div> </div> 但它只在每一行显示一个产品。我想要的最终结果是： <div class="row"> <div class="col-sm4"> … </div> <div class="col-sm4"> … </div> <div class="col-sm4"> … </div> </div> <div class="row"> <div class="col-sm4"> … </div> <div class="col-sm4"> … </div> <div class="col-sm4"> … </div> </div> 我可以用ng-repeat模式（没有指令或控制器）来实现吗？文档介绍了ng-repeat-start和ng-repeat-end，但我不知道如何使用它是这个用例！ […]

Bootstrap 3带有标志的导航栏: 我想使用带有图像标识的Bootstrap 3默认导航栏，而不是文本标记。什么是正确的方式，而不会导致不同的屏幕尺寸有任何问题？我认为这是一个共同的要求，但我还没有看到一个好的代码示例。除了在所有屏幕尺寸上具有可接受的显示以外，关键要求是在较小屏幕上的菜单可折叠性。我试着把一个IMG标签放在带有navbar品牌类的A标签里面，但是导致菜单不能在我的android手机上正常工作。我也尝试增加navbar类的高度，但是这更糟糕了。顺便说一句，我的标志图像比导航栏的高度大。

Twitter Bootstrap 3，垂直中心内容: 我知道这已经被问了一千次，但我找不到一种方式来使文本和图像垂直居中。我正在使用带有dynamic内容的Twitter Bootstrap 3，因此我不知道文本和图像的大小。另外，我希望这一切都是响应。我已经创build了一个总结我尝试实现的布局types的bootply 。基本上，我希望文字和图像垂直居中。文字并不总是大于图像。有人可以帮我解决这个问题吗？谢谢。

为什么Bootstrap 3切换到box-sizing：border-box？: 我将我的Bootstrap主题从v2.3.2迁移到v3.0.0，而我注意到的一件事情是，由于bootstrap.css中的以下样式，很多维度的计算方式不同。 *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } 任何人都可以解释为什么Bootstrap将所有元素的框大小切换到边框？我怀疑这与新的电网系统是以百分比为基础，但上面的select器不仅适用于电网元素明显。似乎有点激进imho 🙂 任何人都在意给一些见解？

如何覆盖Twitter Bootstrap中的样式: 我如何覆盖Twitter Bootstrap中的样式？例如，我正在使用CSS规则为“float：left”的.sidebar类。我怎样才能改变这个，让它向右转？我正在使用HAML和SASS，但是对于Web开发来说，这是相对较新的。

如何显示引导button下拉标题中的选定项目: 我在我的应用程序中使用引导下拉组件像这样： <div class="btn-group"> <button class="btn">Please Select From List</button> <button class="btn dropdown-toggle" data-toggle="dropdown"> <span class="caret"></span> </button> <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu"> <li><a tabindex="-1" href="#">Item I</a></li> <li><a tabindex="-1" href="#">Item II</a></li> <li><a tabindex="-1" href="#">Item III</a></li> <li class="divider"></li> <li><a tabindex="-1" href="#">Other</a></li> </ul> </div> 我想显示所选项目作为btn标签。换句话说，将“请从列表中select”replace为已select的列表项目（“项目I”，“项目II”，“项目III”）。

$（window）.width（）与媒体查询不一样: 我在一个项目上使用Twitter Bootstrap。除了默认的引导样式，我还添加了一些我自己的 //My styles @media (max-width: 767px) { //CSS here } 我也使用jQuery来改变视图的宽度小于767px的页面上的某些元素的顺序。 $(document).load($(window).bind("resize", checkPosition)); function checkPosition() { if($(window).width() < 767) { $("#body-container .main-content").remove().insertBefore($("#body-container .left-sidebar")); } else { $("#body-container .main-content").remove().insertAfter($("#body-container .left-sidebar")); } } 我遇到的问题是由$(window).width()计算的宽度和由CSS计算的宽度看起来不一样。当$(window).width()返回767时，css计算它的视口宽度为751，所以似乎有一个16px的不同。有谁知道是什么原因造成的，我怎么能解决这个问题？人们已经提出，滚动条的宽度没有被考虑，使用$(window).innerWidth() < 751是要走的路。但理想情况下，我想find一个解决scheme，计算滚动条的宽度，这是符合我的媒体查询（例如，两个条件检查值767）。因为肯定不是所有的浏览器将有一个16px的滚动条宽度？