Html col-xs-0无法启动

当我为我的网站模拟我的移动设置时，社交图标应该消失；然而，他们留下来了。我试着把

col-xs-0

放在I帧中，但什么都没有

图片如下：

这是我的页脚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>

您应该使用在移动视图或

xs

（超小）视图中隐藏块：

---

在引导程序4中，您可以使用：

.d-none.d-{screen size}-块

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

文档：

我刚才做了：

.col-xs-0, 
.col-sm-0,
.col-md-0,
.col-lg-0 {
  flex: 0 0 0;
  max-width: 0;
}

---

因为我的目标是让滑动动画“不知从哪里来”，它对我来说很好

JuliaCrush的答案很好，但您必须添加填充：

因此：

---

否则，由于填充，您仍将有一个小列。使用d-none是首选，但是我无法设置显示列的动画，因为使用jquery切换d-none会留下一个style=“visibility:none”。

col-md-2可能会用

display:block

覆盖自定义CSS代码。如果在

bootstrap.CSS

之前包含CSS代码，或者可能是由于特殊性原因，可能会发生这种情况。有一些方法可以使自定义CSS代码更加具体，这样就不会被覆盖。但是更好的选择是使用

隐藏的xs

，正如Praveen的回答所说。有趣。奇怪的是，我以前从未用过它；我想我可能会的。

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

.col-xs-0, 
.col-sm-0,
.col-md-0,
.col-lg-0 {
  flex: 0 0 0;
  max-width: 0;
}

.col-xs-0, 
.col-sm-0,
.col-md-0,
.col-lg-0 {
  flex: 0 0 0;
  max-width: 0;
  padding-right: 0;
  padding-left: 0;
}