Questions tagged «twitter-bootstrap-3»

Bootstrap 3是前端框架的第三代，可通过具有吸引力的外观和感觉来加快Web开发速度。与[twitter-bootstrap]标签一起使用

6
禁用Bootstrap中的链接
第一个示例不起作用。我需要始终有一个列表来禁用链接吗？还是我的第一个演示有什么问题？ <a class="disabled" href="#">Disabled link</a> <ul class="nav nav-pills"> ... <li role="presentation" class="disabled"><a href="#">Disabled link</a></li> ... </ul> https://jsfiddle.net/7y0u2amy/
10
无法使用Bootstrap 3更改占位符颜色
两个问题： 我正在尝试将占位符文本设置为白色。但这是行不通的。我正在使用Bootstrap 3。JSFiddle demo 另一个问题是如何不全局更改占位符颜色。也就是说，我有多个字段，我只希望一个字段具有白色占位符，其他所有字段均保持默认颜色。 提前致谢。 的HTML： <form id="search-form" class="navbar-form navbar-left" role="search"> <div class=""> <div class="right-inner-addon"> <i class="icon-search search-submit"></i> <input type="search" class="form-control" placeholder="search" /> </div> </div> </form> CSS： .right-inner-addon { position: relative; } .right-inner-addon input { padding-right: 30px; background-color:#303030; font-size: 13px; color:white; } .right-inner-addon i { position: absolute; right: 0px; …
12
在OS X上的Firefox中，Bootstrap 3 Styled Select下拉菜单看起来很难看
<select>在Bootstrap 3中设置表单元素的样式时，它将在OS X的Firefox中呈现一个难看的按钮： （http://bootply.com/98385） 显然，这已经是一段时间以来的已知问题了，并且有许多hack和变通办法，但没有一个很干净（ https://github.com/twbs/bootstrap/issues/765）。我想知道是否有人使用Bootstrap下拉列表或其他插件找到了解决此问题的好方法。我故意选择使用HTML<select>而不是Bootstrap下拉列表，因为在移动设备上使用长列表时，可用性更好。 这是Firefox问题还是Bootstrap问题？ 详细信息：Mac OS X 10.9，Firefox 25.0.1 更新12/4/13：我对每种浏览器如何<select>使用Firefox，Chrome和Safari在OS X 10.9上呈现的进行了并排比较，以响应@zessx（使用http://bootply.com / 98425）。显然，<select>表单元素在浏览器和操作系统之间的呈现方式之间存在很大差异： 我了解，<select>根据您使用的操作系统，对标签的处理方式有所不同，因为存在基于操作系统的本机控件来指示样式和行为。但是，class="form-control"导致Bootstrap的<select>表单元素在Firefox中看起来与众不同的原因是什么？为什么<select>Firefox中默认的未设置样式的样式看起来可以，但是一旦被设置样式，则看起来很难看？
15
Bootstrap 3：如何使下拉链接的标题在导航栏中可点击
我使用的是默认导航栏，其中一些列表项是下拉菜单。我无法点击触发下拉菜单的链接。我知道我可以在下拉列表中添加一个重复的链接，但我不愿意。是否可以将头部链接设为可点击的链接（而不仅仅是下拉菜单的句柄）？ 作为参考，请参见下面下拉菜单中的第一个链接。我希望用户能够单击它并实际转到它指向的页面。 <nav class="navbar navbar-fixed-top admin-menu" role="navigation"> <div class="navbar-header">...</div> <!-- Collect the nav links, forms, and other content for toggling --> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav navbar-right"> <li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#"> I DONT WORK! <b class="caret"></b> </a> <ul class="dropdown-menu"> <li><a href="/page2">Page2</a></li> </ul> </li> <li><a href="#">I DO …
12
Flexbox在Safari中包装第一行的最后一列
在Safari和其他一些基于iOS的浏览器中查看时，第一行的最后一列将换行到下一行。 苹果浏览器： Chrome /其他： 码： .flexthis { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .flexthis .col-md-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } <div class="row flexthis"> <div class="col-md-4 col-sm-6 text-center"> <div class="product"> <img src="img.jpg" alt="" class="img-responsive"> <h3>Name</h3> <p>Description</p> </div> …
9
以响应方式更改文本对齐（使用Bootstrap 3）？
我正在为博客使用Bootstrap 3。在我的自定义CSS中，我最近添加了 body { text-align: justify; ... } 我喜欢更大屏幕（平板电脑，台式机）上的结果。但是在小屏幕（电话）上，由于列较窄加上我的博客偶尔使用，所以合理文本无法正常工作long-ish-technical-terms-like-this。 我可以text-align: justify 仅在较大的屏幕上进行响应吗？ 是否可以仅通过CSS来做到这一点，还是需要编写一些自定义JS来做到这一点？
10
如何使Bootstrap传送带滑块使用移动的向左/向右滑动
演示JSSFIDDLE <div class="col-md-4"> <!--Carousel--> <div id="sidebar-carousel-1" class="carousel slide" data-ride="carousel"> <ol class="carousel-indicators grey"> <li data-target="#sidebar-carousel-1" data-slide-to="0" class="active"></li> <li data-target="#sidebar-carousel-1" data-slide-to="1"></li> <li data-target="#sidebar-carousel-1" data-slide-to="2"></li> </ol> <div class="carousel-inner"> <div class="item active"> <a href="" data-lightbox="image-1" title=""> <img src="http://shrani.si/f/3D/13b/1rt3lPab/2/img1.jpg" alt="..."> </a> </div> <div class="item"> <a href="" data-lightbox="image-1" title=""> <img src="http://shrani.si/f/S/jE/UcTuhZ6/1/img2.jpg" alt="..."> </a> </div> <div class="item"> …
7
在Bootstrap 3中堆叠列时的垂直空间
在移动模式下堆叠列时，我想要一些垂直空间来分隔列内容，我该怎么办？ 请参阅http://jsfiddle.net/tofutim/3sWEN/中的jsfiddle，并更改输出的宽度。第二个lorem ipsum之前应该有一些间距。 <div class="container"> <div class="well well-lg" style="margin:10px"> <div class="row"> <div class="col-sm-6"> <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."</p> <form> <input type="textbox" class="form-control" placeholder="Username"></input> <input type="password" class="form-control" placeholder="Password"></input> </form> </div> <div class="col-sm-6"> <p>"Lorem ipsum dolor sit amet, …
21
如何在没有水平滚动条的情况下使bootstrap 3流畅布局
这是示例链接：http : //bootply.com/76369 这是我使用的html。 <div class="row"> <div class="col-md-6">.col-md-6</div> <div class="col-md-6">.col-md-6</div> </div> 引导程序3没有容器流体和行流体。 我不能用.container类包装它，因为它将变成固定的布局。 如何使其流畅（全页面宽度）布局？（不带水平滚动条） 这些标记。当您在结果中查看时，x滚动条可见，因此您可以向左和向右滚动，而不应该滚动。 编辑日期：2015-12-09 自3.1.0版以来，已有答案且Bootstrap已发布此修复程序
4
role = form如何帮助可访问性？
我已经读到该role属性已添加到Bootstrap中以实现可访问性，并且我想知道如何<form role="form">帮助可访问性。有关此特定用法的示例，请参见http://getbootstrap.com/css/#forms-example。 我没有在Bootstrap的回购中搜索“角色”。 我的问题是该信息似乎多余。HTML标记本身（）已经表达了元素是表单的概念<form>，因此如果我们还添加元素正在播放roleof的信息，这有什么帮助form？添加role="..."是否role要不同于form（我不知道是什么-但让我们假装）；就目前而言（尤其是没有具体的推理/用例示例），充其量令人困惑。
11
输入组-两个输入彼此靠近
如何使输入组包含两个输入？ <div class="input-group"> <input type="text" class="form-control" placeholder="MinVal"> <input type="text" class="form-control" placeholder="MaxVal"> </div> 这不起作用，它们是水平的而不是嵌入式的
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.