col-xs-0不工作引导程序

Question

当我模仿我的网站的移动设置时,社交图标应该消失; 然而,他们留下来.我试过自己放入col-xs-0i帧,什么都没有.

这是图片:

这是我的页脚HTML.

<footer>
    <div class="container-fluid">
            <div class="row">
                <div class="col-xs-0 col-md-2 pull-right footersocial">
                    <a href="#" target="_blank"><i class="fa fa-facebook-official fa-3x socialicons"  aria-hidden="true"></i></a>
                    <a href="#" target="_blank"><i class="fa fa-twitter fa-3x socialicons" aria-hidden="true"></i></a>
                    <a href="#" target="_blank"><i class="fa fa-instagram fa-3x socialicons" aria-hidden="true"></i></a>
                </div>
            </div>
        <div class="row" style="margin-left: 15px; margin-top: 15px;">
            <div class="col-md-2 text-center">
                <p>Privacy Policy</p>
            </div>
            <div class="col-md-2 text-center">
                <p>Terms of Service</p>
            </div>
            <div class="col-md-2 text-center">
                <p>Acceptable Use Policy</p>
            </div>
            <div class="col-md-2 text-center">
                <p>Warranty & Returns Policy</p>
            </div>
            <div class="col-md-2 text-center">
                <p>Third Party Copyright Notices</p>
            </div>
            <div class="col-md-2 text-center">
                <p>Terms of Service for Phone</p>
            </div>
        </div>
    </div>
</footer>

我的CSS:

.socialicons {
    color: white;
    margin-right: 10px;
    margin-top: 10px;
    margin: 0 auto;
    display: block;
}
.footersocial {
  margin: 0 auto;
  display: block;
}
.col-xs-0 {
    display: none;
}

Answer 1

您应该使用hidden-xs隐藏移动视图中的块或xs(超小)视图:

<div class="hidden-xs col-md-2 pull-right footersocial">

Answer 2

在 Bootstrap 4 中您可以使用：

.d-无 .d-{屏幕尺寸}-块

根据屏幕大小隐藏元素（xs、sm、md 等）

文档：这里