css – twitter bootstrap在xs模式下的文本中心

前端之家收集整理的这篇文章主要介绍了css – twitter bootstrap在xs模式下的文本中心前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有html作为:
<footer>
<div class="container">
    <div class="row">
        <div class="col-xs-12 col-sm-6 text-left">
            <p>
                &copy; 2015 example.com. All rights reserved.
            </p>
        </div>
        <div class="col-xs-12 col-sm-6 text-right">
            <p>
                <a href="#"><i class="fa fa-facebook"></i></a> 
                <a href="#"><i class="fa fa-twitter"></i></a> 
                <a href="#"><i class="fa fa-google-plus"></i></a>
            </p>
        </div>
    </div>
</div>
</footer>

代码中,您可以看到列的文本分别左右对齐.然而在xs模式下,我喜欢他们对齐.如何使用twitter引导程序?

解决方法

没有什么内置的引导为此,但一些简单的css可以解决它.这样的事情应该有效.没有测试
@media (max-width: 768px) {
      .col-xs-12.text-right,.col-xs-12.text-left {
              text-align: center;
       } 
    }

猜你在找的CSS相关文章