如何使用引导程序隐藏卡

Question

所以我试图只在xs屏幕上隐藏引导卡。为了测试我的代码，我尝试过在所有屏幕大小上隐藏，但对它们也不起作用。

<div class"container">
<div class="d-none d-sm-block">
<div class="card">
<p style="padding:5px">Meet the Club</p>
<div class="row">
<div class="col-md-4">     
<figure class="figure">...

Answer 1

如果你发布一个最小的例子，但你可以使用，那会更好

.d-none .d-sm-block 

在同一个元素上(在这种情况下，您可以将其添加到card类或包含div(，以在xs屏幕中隐藏某些内容

Answer 2

如注释中所述，有一种方法可以使用bootstrap来实现：CCD_ 1。我确实在你的例子中看到，你已经包含了这个类。也许您的bootstrap版本比较旧，并且不包括display(d-*(助手。我会尝试使用.visible-xs-*方法，在bootstrap 3上可用(在版本2中找不到(

或者，您可以使用@media作为xs屏幕大小(您可以通过搜索引导程序屏幕大小轻松找到它，对于xs，它是576px(，然后在元素上使用visibility: hidden或display: none

例如：

@media (min-width: 1000px){
.elementClass{
visibility: hidden;
}
}