标签: bootstrap-4

我将如何修改CSS以更改Twitter Bootstrap中导航栏的颜色？

是什么之间的差异col-lg-*,col-md-*并col-sm-*在Twitter的引导？

我在这里有一个简单的演示:

http://jsfiddle.net/HdeZ3/1/

<ul>
    <li>One <input class="btn pull-right" value="test"></li>
    <li>Two <input class="btn pull-right" value="test2"></li>
</ul>

我有一个无序列表,对于每个列表项,我希望左边有文本,然后是右对齐按钮.我试图使用右拉,但这完全弄乱了对齐.我究竟做错了什么？

我正在使用Bootstrap,以下不起作用:

<tbody>
    <a href="#">
        <tr>
            <td>Blah Blah</td>
            <td>1234567</td>
            <td>£158,000</td>
        </tr>
    </a>
</tbody>

在引导,什么是最平台友好的方式来创建一个导航栏,有徽标中的左边,在中心菜单项和标志B上的吧？

这是我到目前为止已经试过,它最终被对齐,使标志A是在左边,菜单项旁边的右边的左边和标志B中的标志.

<div class="navbar navbar-fixed-top navbar-custom ">
  <div class="container" >
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#"><span class="navbar-logo">Logo_A</span></a>
    </div>
    <div class="collapse navbar-collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">Home</a></li>
        <li><a href="#about">Menu Item 1</a></li>
        <li><a href="#contact">Menu Item 2</a></li>
        <li><a href="#about">Menu Item 3</a></li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#"><img src="images/Logo_B.png" class="img-responsive"></a></li>
      </ul>
    </div>
  </div>
</div>

我想在我正在构建的页面上有5个相等的列,我似乎无法理解这里是如何使用5列网格的:http://web.archive.org/web/20120416024539/http : //domain7 .COM /移动/工具/引导/响应

五列网格是否在twitter bootstrap框架的上方展示了？

如何将导航栏项目对齐？

我想登录并注册到右边.但我尝试的一切似乎都不起作用.

这是我到目前为止所尝试的:

• <div>围绕<ul>着属性:style="float: right"
• <div>围绕<ul>着属性:style="text-align: right"
• 在<li>标签上尝试了这两件事
• !important添加到最后再尝试所有这些东西
• 改变nav-item以nav-right在<li>
• 添加了一个pull-sm-right类<li>
• 添加了一个align-content-end类<li>

这是我的代码:

<div id="app" class="container">
  <nav class="navbar navbar-toggleable-md navbar-light bg-faded">
    <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
    <a class="navbar-brand" href="#">Navbar</a>
    <ul class="navbar-nav">
      <li class="nav-item active">
        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Features</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" …

我们有一个强烈使用glyphicons的项目.Bootstrap v4完全删除了glyphicon字体.

Bootstrap V4附带的图标是否相同？

http://v4-alpha.getbootstrap.com/migration/

我正在尝试使用Bootstrap 4将我的Container放在页面中间.

在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中有没有更好的方法可以忽略我？