html - 在台式机/平板电脑中链接一行，在移动设备中链接两列？

Question

我有一个包含链接的页面部分，在桌面/移动设备上应该是这样的:

link link link link link link

但这是在手机上

link    link
link    link
link    link

您能否就如何在 Bootstrap 中实现这一点提供任何建议？我现在正在使用如下 HTML。不同的 HTML 会有帮助吗？

<span class="col-xs-12 text-center" >
    <a href="http://link" class=" col-xs-6" >link</a>
    <a href="http://link" class=" col-xs-6" >link</a>
    <a href="http://link" class=" col-xs-6" >link</a>
    <a href="http://link" class=" col-xs-6" >link</a>
    <a href="http://link" class=" col-xs-6" >link</a>
    <a href="http://link" class=" col-xs-6" >link</a>
</span>

Answer 1

<div class="row">
  <span class="col-md-12 col-xs-12 text-center">
    <a href="http://link" class="col-md-2 col-xs-6">link</a>
    <a href="http://link" class="col-md-2 col-xs-6">link</a>
    <a href="http://link" class="col-md-2 col-xs-6">link</a>
    <a href="http://link" class="col-md-2 col-xs-6">link</a>
    <a href="http://link" class="col-md-2 col-xs-6">link</a>
    <a href="http://link" class="col-md-2 col-xs-6">link</a>
  </span>
</div>

如果你想让它们在移动端有相同的单行结构，使用col-xs-2

Bootply