草庐IT

$bootstrap

全部标签

jquery - 在移动 View 中将 Bootstrap 选项卡切换为下拉列表

我有一个使用Bootsrtap3开发的网站,那里有标签元素。从移动设备浏览时,我必须将选项卡式元素设置为下拉菜单。可能吗?HomeProfileMessagesSettingsABCD我在Bootstrap中使用基本选项卡。 最佳答案 以下css将基本设计应用于设备宽度>=480px的设备的选项卡。您可以更改此限制宽度以获得更高的手机分辨率:@mediascreenand(max-width:480px){.nav{padding-left:2px;padding-right:2px;}.navli{display:block!im

jquery - Bootstrap 如何使固定高度响应?

如何使固定高度的元素响应bootstrap3?例如,我将carousal的高度设置为650px。但我不能让它像图片那样响应。有什么想法吗?CSS,#article-carousel.carousel-inner{height:650px;}html,.... 最佳答案 您可以使用css3object-fit调整图像大小http://jsfiddle.net/xcoq9xxg/img{height:650px;width:100%;object-fit:cover;//here}它适用于Chrome和Opera。为其他人使用polyf

html - 如何使用 bootstrap 在 div 周围创建圆 Angular 边框?

我正在使用bootstrap3。inputtype=text元素很酷。现在我想在div元素周围创建一个类似的圆形边框。我尝试过的任何东西看起来都很丑陋,bootstrap3有可能吗?提前致谢 最佳答案 要快速使div看起来像Bootstrap输入,只需将.form-control类添加到您的div。Iaminsideadiv.另请查看BootstrapPanels.由于div不是表单控件,因此面板具有圆Angular并且更适合div。Iaminsideapanel.HereisaJSFiddledemoofbothoptions.

html - 在 Bootstrap 轮播中的图像上添加文本

我有一个带图像的轮播,我想在上面放置文本,但它不起作用。文字显示在图片下方,而不是覆盖在图片上方TESTWhatwedoWhatweDoWhoweAre 最佳答案 您可以简单地定位元素absolutely就像内置标题一样,并设置top/bottom,left/right偏移。请注意,轮播标题默认具有z-index:10,因此您可能希望为定位元素提供更高的z-index:例如:.carousel-content{position:absolute;bottom:10%;left:5%;z-index:20;color:white;te

javascript - Bootstrap 3 下拉过渡

首先是fiddle只是一个常规的Bootstrap下拉菜单,我对css做了一些更改,以便下拉菜单出现在悬停时(而不是单击),但我如何想要一个非常简单的淡入淡出动画。我尝试了csstransition,但它没有用,因为.dropdown-menu元素应用了“display:none”,悬停时它变为“display:block”。如何为从“diplay:none”更改为“display:block”的元素制作动画,或者是否有任何其他方法可以实现此目的?我已经用谷歌搜索了这个并找到了一些答案,但他们没有帮助。HTML代码:DropdownActionAnotheractionSomethin

javascript - Bootstrap 旋转木马内部 "autoplay"

有人能帮帮我吗?我知道这里有一些错误。为什么我必须在页眉末尾和页面底部链接bootstrap.min.js。我尝试一次使用一个,但它不起作用。接下来是我希望在加载页面和单击Controller时启动轮播;不仅仅是当我点击Controller时。TheJamesBaldwinSchoolTheJamesBaldwinSchoolHomeAboutContactParentsActionAnotheractionSomethingelsehereSeparatedlinkOnemoreseparatedlinkStudentsActionAnotheractionSomethingelse

html - Bootstrap : How to "stick" a button over an image when re-sizing

我有一个图像,我需要在其中放置一个按钮,问题是我不知道如何放置按钮并在缩小浏览器时自动调整大小和位置,现在我有按钮就位,但当我重新调整浏览器大小时按钮移动变小,我尝试在css购买中使用百分比不起作用,我该怎么办?textCSS:.withimg{width:100%;overflow:hidden;padding:0px;margin:0px;}#discover{position:relative;}#bttnimg{float:left;position:absolute;left:62%;top:25%;max-width:750px;} 最佳答案

html - Bootstrap 固定导航栏的打印问题

我制作了带有Bootstrap固定导航栏的网站。它有固定的导航栏,因此在样式表正文中有70像素的顶部填充。当我打印页面时,它会在纸张顶部添加额外的空间。我该怎么做才能消除由顶部填充引起的额外空间。下面是带填充的打印预览下面是没有填充的打印预览,我希望顶部空间较小。如果我删除填充,则打印效果如我所愿,但在浏览器中,内容位于导航栏后面,我看不到前2-3行。请给我一些解决方案来保留固定的导航栏,并且填充不会包含在打印中。 最佳答案 像这样添加一个新的打印样式表(将其放在主样式表之后):在print.css中为body标签设置新的CSS规则

javascript - 选项卡 "shown"事件未触发 - Twitter Bootstrap

当标签更改时,我正在尝试解雇Ajax调用。但是,我什至无法让这个基本测试工作:UploadResultsDownload和javascript:(function($){"usestrict";$(function(){$(document).on('shown','a[data-toggle="tab"]',function(e){alert('TABCHANGED');});});}(jQuery));当任何选项卡更改时,它应该向我发送警报。为什么这个简单的示例不起作用?文档中的基本示例也不起作用。整个事件(甚至按钮点击)似乎是不可见的-我似乎无法以任何方式捕捉到它。

html - 如何在 Bootstrap 3 列中垂直对齐 div

我有一个包含TwitterBootstrapcontainer-fluid类div的页面,一个row和一个col-md-6在那一行里面。行设置为容器高度的50%,列的高度为行的100%。我在该列中有一个div,我希望它位于列的中心。风格是:html,body{height:100%;}.cont{height:100%;background:blue;}.logoRow{height:50%;background:green;}.logoCol{height:100%;background:yellow;}.logoCont{height:50%;width:50%;backgroun