草庐IT

bootstrap-grid

全部标签

html - 当包含 div 大小的父项发生变化时,如何动态更改 ng-grid 表的大小?

我正在使用ng-class和一个评估是否显示编辑表单的表达式来更改包含的div的大小。如果显示编辑表单,我想更改包含ng-grid和ng-grid本身的div的大小。ActivitiesNeedingMyApprovalMyActivitiesNeedingApprovalMyActivities-->包含导航栏和网格的div通过ng-class更改大小(从span12到span7),但ng-grid不刷新。鉴于父div的变化,如何触发ng-grid的刷新?我在下面包含了我的gridOptions:$scope.gridOptions={plugins:[gridLayoutPlugi

html - 使用 bootstrap 将 Div 并排放置

我已经尝试使用row类,但它没有解决问题。我只是想把两个div放在一起,只使用bootstrap而不是css。(这是我无法添加任何css的极端情况)有没有办法做到这一点?基本上我有这个:button1button2而且我希望这两个按钮彼此相邻并且由于限制我不能添加除Bootstrap之外的任何css。这可能吗? 最佳答案 您的代码示例未显示具有container或container-fluid类的父div,并且您的列缺少大小类。试试这个:button1button2 关于html-使用b

html - 为什么 bootstrap input-group & input-group-addon 拆分?

我在表单水平div中有一个输入组,它在大屏幕上看起来很棒。它在bootply中看起来也很棒,但是每当我开始调整屏幕大小时,表单就会换行(没关系),但输入组插件会从输入组中拆分或分离。我尝试了多种css和样式的组合。如何防止这种行为?在大屏幕上:在小屏幕上:HTML:StartFullHDBLHDALOther 最佳答案 Bootstrap3随.col-xs-、.col-md-、.col-lg-提供,与显示有关渲染设备的大小将HTML代码中的class="col-md-替换成class="col-xs-试试看美好的一天

css - 为什么 Bootstrap 将最后一列推到下一行

我有以下HTMLsomecontenthere17:00-18:00SomelooooooooooooooooooooooooooooooooooongTextgoeshere我想要的是我的嵌套行在320x480设备上具有[1][4][7]布局。但是,当我将大小时调整为大约350宽度时,最后一列位于日期下方的下一行。我希望文本位于日期的右侧,而不是在日期下方(320x480)。如果我将最后一列的宽度更改为6,则效果很好。这是什么原因?由于1+4+7=12我希望它也能工作。 最佳答案 您将不得不覆盖该大小的填充。问题是一列占总宽度的8

html - 在 bootstrap 汉堡图标左侧添加电话和 map 图标

我有一个基本的Bootstrapv3网站。当导航栏在较小的屏幕上切换到汉堡包图标时,我想添加一个电话图标(链接到电话号码)和一个map图标(链接到谷歌地图),以便移动用户可以轻松访问它们。我尝试通过在.navbar-toggle按钮之前添加代码,在汉堡包的左侧添加一个电话图标,但我不知道如何让它像汉堡包图标一样响应。我可以定位它,但这并不能让它保持响应。这是我当前的代码。我试图让它只使用电话图标,但我也希望在它旁边放置一个map图标。大部分样式是从bootstrap.min.css文件中的.nav-bar-toggle类样式复制的。@importurl('https://maxcdn.

html - Bootstrap 4 导航栏右对齐

我正在使用来自Bootstrap4网站的导航栏模板,但我在折叠导航项的位置方面遇到了问题。最初,切换按钮位于导航栏和列表项的左侧。但我希望它们位于页面的右侧,所以我在按钮和导航项上插入了一个float-xs-right类。然后,如果我单击切换按钮,则折叠项的位置不正确。正如您在屏幕截图中所见。Navbarscreenshot我希望折叠项位于下方和左侧。顺便说一句,这是我的代码:TributePage|TupacShakurHomeBioGalleryDetailsAwardsMoreinfo此外,这是我为这个导航栏编写的代码笔:http://codepen.io/marcvs/pen/

html - bootstrap 下拉菜单同一水平行上的两个链接

我正在使用Bootstrap制作下拉菜单。我想要的选项之一是下拉菜单中同一水平行上的两个链接。我将如何实现这一点?DropdownButtonOnFirstRowOnSecondRowOnThirdRowAlsoOnThirdRow 最佳答案 您解决的代码在这里>>>>twolinksinonedropdownlistitemhtmlDropdownButtonOnFirstRowOnSecondRowOnThirdRowAlsoOnThirdRowCSS.open>ul>li.hz{display:inline-flex!impo

html - 选择正确的 Html 5 框架 - HTML5 Boilerplate、Skeleton、Twitter Bootstrap 和 HTML KickStart

关闭。这个问题不符合StackOverflowguidelines.它目前不接受答案。要求我们推荐或查找工具、库或最喜欢的场外资源的问题对于StackOverflow来说是偏离主题的,因为它们往往会吸引自以为是的答案和垃圾邮件。相反,describetheproblem以及迄今为止为解决该问题所做的工作。关闭8年前。Improvethisquestion我需要关于为HTML5UI开发选择上述框架之一的建议(我对这个世界的尽头很陌生)。主要要求之一是通过重用/修改现有的UI控件来使UI开发尽可能简单。我们需要它在生产环境中轻量级并且稳定(与SpringMVC对话)。从经验丰富的手中快速总

javascript - 使 HTML 表格适合 Bootstrap 对话框

我正在为我的网站创建一个BootStrap对话框,用户可以通过它导入他的google联系人。该对话框有一个表格,其中包含4列。只有表头是静态的,行由JavaScript代码动态填充。4列是..Email|Name|Mobile|Import当电子邮件的长度很小时,表格完全适合对话框,但如果列表中的电子邮件ID很长,则最后两列(移动、导入)不适合对话框HTML代码..×ImportGoogleContactsPleaseSelecttheGoogleContactsyouwanttoImportEmailNameMobileImport-->CancelSaveSelectedFrien

javascript - 如何根据其值隐藏 ui-grid 中的某些行?

我有一个带有这些选项的简单UI网格:$scope.transactionGrid={enableSorting:true,enableColumnResize:true,enableScrollbars:true,enablePaginationControls:false,minRowsToShow:6,onRegisterApi:function(gridApi){$scope.gridEventsApi=gridApi;}};我想隐藏具有特定值的行,已删除:“y”。$scope.transactionGrid.data=[{Name:"First",deleted:"y"},{N