小编Mar*_*ren的帖子
在twitter bootstrap中有五个相等的列
我想在我正在构建的页面上有5个相等的列,我似乎无法理解这里是如何使用5列网格的:http://web.archive.org/web/20120416024539/http : //domain7 .COM /移动/工具/引导/响应
五列网格是否在twitter bootstrap框架的上方展示了？
推荐指数
解决办法
查看次数
Bootstrap 4 - Glyphicons迁移？
我们有一个强烈使用glyphicons的项目.Bootstrap v4完全删除了glyphicon字体.
Bootstrap V4附带的图标是否相同？
推荐指数
解决办法
查看次数
在Bootstrap v4中缺少可见 - **和隐藏 - **
在Bootstrap v3中,我经常使用隐藏的 - **类结合clearfix来控制不同屏幕宽度的多列布局.例如,
我可以将多个隐藏的**组合在一个DIV中,以使我的多列在不同的屏幕宽度下正确显示.
例如,如果我想显示产品照片的行数,则在较大屏幕尺寸上每行4个,在较小屏幕上每行4个,在非常小的屏幕上显示2个.产品照片可能是不同的高度,所以我需要clearfix以确保正确的行中断.
这是v3中的一个例子......
http://jsbin.com/tosebayode/edit?html,css,output
既然v4已经废除了这些类,并用可见/隐藏 - ** - 向上/向下类替换它们,我似乎不得不用多个DIV做同样的事情.
这是v4中的一个类似例子......
http://jsbin.com/sagowihowa/edit?html,css,output
所以我已经从单个DIV转到必须添加多个具有大量上/下类的DIV来实现相同的功能.
从...
<div class="clearfix visible-xs-block visible-sm-block"></div>
至...
<div class="clearfix hidden-sm-up"></div>
<div class="clearfix hidden-md-up hidden-xs-down"></div>
<div class="clearfix hidden-md-down"></div>
在v4中有没有更好的方法可以忽略我？
推荐指数
解决办法
查看次数
右侧的Bootstrap 4导航栏项目
我刚刚切换到bootstrap 4并重新编写我的所有html和scss来处理它,我似乎无法找到如何在导航栏的右侧放置一组导航项.这是我的导航栏代码:
<nav class="navbar navbar-full navbar-dark bg-primary">
<button class="navbar-toggler hidden-md-up" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"></button>
<%= link_to "Living Recipe", recipes_path(sort_attribut: "popularity", sort_order: :desc), class: "navbar-brand" %>
<div class="collapse navbar-toggleable-sm" id="navbarResponsive">
<ul class="nav navbar-nav float-md-left">
<li class="nav-item">
<%= form_tag(recipes_path, :method => "get", id: "search-form", class: "form-inline") do %>
<%= text_field_tag :search, params[:search], placeholder: "Search Recipes", class: "form-control col-md-8" %>
<% end %>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="http://example.com" id="responsiveNavbarDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Browse</a>
<div class="dropdown-menu" aria-labelledby="responsiveNavbarDropdown">
<%= link_to …推荐指数
解决办法
查看次数
如何修复错误; '错误:Bootstrap工具提示需要Tether(http://github.hubspot.com/tether/)'
我正在使用Bootstrap V4,并在控制台中记录以下错误;
错误:Bootstrap工具提示需要Tether(http://github.hubspot.com/tether/)
我试图通过安装Tether删除错误,但它没有奏效.我通过包含以下代码行'安装'Tether;
<link rel="stylesheet" href="http://www.atlasestateagents.co.uk/css/tether.min.css">
<script src="http://www.atlasestateagents.co.uk/javascript/tether.min.js"></script>
我是否正确安装了系绳？
任何人都可以帮我删除此错误？
如果您希望在我的网站上查看错误,请单击此处并加载您的控制台.
推荐指数
解决办法
查看次数
Bootstrap 4响应表不会占用100%的宽度
我正在使用Bootstrap 4构建一个Web应用程序并遇到一些奇怪的问题.我想利用Bootstrap的表响应类来允许在移动设备上水平滚动表.在桌面设备上,表格应占据包含DIV宽度的100%.
一旦我将.table-responsive类应用到我的表中,表就会水平缩小,不再占用宽度的100%.有任何想法吗？
这是我的标记:
<!DOCTYPE html>
<html lang="en" class="mdl-js">
<head>
<title></title>
<meta charset="utf-8">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="application-name" content="">
<meta name="theme-color" content="#000000">
<link rel="stylesheet" href="/css/bundle.min.css">
</head>
<body>
<div class="container-fluid no-padding">
<div class="row">
<div class="col-md-12">
<table class="table table-responsive" id="Queue">
<thead>
<tr>
<th><span span="sr-only">Priority</span></th>
<th>Origin</th>
<th>Destination</th>
<th>Mode</th>
<th>Date</th>
<th><span span="sr-only">Action</span></th>
</tr>
</thead>
<tbody>
<tr class="trip-container" id="row-6681470c-91ce-eb96-c9be-8e89ca941e9d" data-id="6681470c-91ce-eb96-c9be-8e89ca941e9d">
<td>0</td>
<td>PHOENIX, AZ</td>
<td>SAN DIEGO, CA</td>
<td>DRIVING</td>
<td><time datetime="2017-01-15T13:59">2017-01-15 13:59:00</time></td>
<td><span class="trip-status-toggle fa fa-stop" data-id="6681470c-91ce-eb96-c9be-8e89ca941e9d" data-trip-status="1"></span></td>
</tr>
<tr class="steps-container" data-steps-for="6681470c-91ce-eb96-c9be-8e89ca941e9d" …推荐指数
解决办法
查看次数
Bootstrap 4 img-circle类无效
我正在用HTML5和Bootstrap 4编写一个网站,我试图将一个方形图像变成一个圆圈.在Bootstrap 3中,这很容易实现.img-circle,但现在我似乎无法使其工作,我无法在线找到任何答案.Bootstrap是否已经删除了img-circle类或者我的代码搞砸了？
它是这样的:
<!-- Within a tab-content div -->
<div class="col-xs-7">
<img src="img/gallery2.JPG" class="img-circle" alt="HelPic>
</div>
希望有人可以帮助我:)
推荐指数
解决办法
查看次数
Bootstrap 4下拉菜单不起作用？
我复制了正式的Bootstrap 4示例用于下拉菜单,但它不起作用,没有任何内容被删除.
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="dropdown01" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
<div class="dropdown-menu" aria-labelledby="dropdown01">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</li>
推荐指数
解决办法
查看次数
用凉亭安装Bootstrap 4
我已经生成了一个yeoman网站,并附带了bootstrap 3,我该如何安装bootstrap 4.
所有教程都说要运行"bower install bootstrap",但这只是再次安装bootstrap 3.
推荐指数
解决办法
查看次数
Bootstrap 4 - 隐藏类 - 仅隐藏在小屏幕上
如何span仅在小(sm)屏幕上隐藏内容？我需要在xs屏幕上显示这些内容.
<span class="hidden-sm-down">Text</span>
有没有办法只使用bootstrap类来执行此操作？
推荐指数
解决办法
查看次数
标签 统计
bootstrap-4 ×10
css ×3
javascript ×2
bower ×1
glyphicons ×1
html ×1
html5 ×1
tether ×1
yeoman ×1