Bootstrap 4“隐藏”类不能一致地工作

Question

我在使用“隐藏”类来隐藏特定大小的内容时遇到了问题。它适用于某些内容，但不适用于其他内容。

我使用：

    <div class="hidden-sm">something to hide in small viewports </div>

我已经尝试了导航品牌的标志，它的工作，但它不工作在导航栏，一些图片等…

使用下面的代码可以工作(但将其永久隐藏)

<div hidden> something to hide in small viewports </div>

使用下面的代码根本不起作用

<div hidden-sm> something to hide in small viewports </div>

有人能解释一下它的用法吗？Bootstrap文档没有提供太多细节

此外，正如你可以清楚地看到，我不是很擅长CSS或JavaScript，所以我真的宁愿只从CDN导入bootstrap而不创建我自己的CSS文件。(如果可能)

Answer 1

在html中，你有class、alt、src等属性。

在第一种情况下，您使用了属性类并为其提供了一个引导类，这就是它工作的原因。

第二个例子，你使用了一个名为hidden的html属性，这就是它工作的原因。

第三个代码不起作用，因为隐藏的-sm不是一个有效的属性。你需要说的是...

<div class="hidden-sm"> something to hide in small viewports </div>

https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden