bootstrap列偏移反应不起作用

Question

i有一个行容器和包含图像的几个div元素。束中的第一个DIV元素具有一类col-xs-2以及offset-xs-3。由于某种原因，我未知，这将行不通。

这是代码：

<div>
    <div className='jumbotron' style={{'text-align': 'center'}}>
      <h1 className='header'>Welcome to Redux</h1>
      <h4 className='header_subtext'>Check out dynamic state alteration</h4>
      <br />
      <div className='row'>
        <div className='col-xs-2 offset-xs-3 '>
          <img src='react.png' height='96' alt='React' onClick={this.handleVoteReact} />
        </div>
        <div className='col-xs-2'>
          <img src='vue.png' height='96' alt='React' onClick={this.handleVoteVue} />
        </div>
        <div className='col-xs-2'>
          <img src='angular.png' height='96' alt='React' onClick={this.handleVoteAngular} />
        </div>
      </div>
    </div>
  </div>

Answer 1

由于某种原因对我而言，它将不起作用。

原因很简单：

Bootstrap 4(再(中没有-xs-。

只需用col-2替换col-xs-2和offset-xs-3用offset-3替换。

Bootstrap 4是"移动第一"。

这就是为什么" XS"是多余的，不需要的原因，也是将其删除的原因。

参考：

https://getbootstrap.com/docs/4.0/layout/grid/#grid-poptions