需要悬停状态激活以响应响应布局

Question

我的网站上有一个可爱的悬停状态，其中一个盒子悬挂着内容，就在幻灯片的底部。但我希望悬停状态显示内容随时显示为较小的屏幕。尽管如此，我没有运气。悬停状态为“a href”。

这是用CSS还是用jQuery完成的？无论如何，是否有人有特定的方向，他们可以为此发送给我？

相关（我认为）：此主页上的某些内容使屏幕向左/向右滚动。我还没有发现导致这种情况的div，但我显然遗漏了一些东西。

site

Answer 1

Media queries应该是你想要的：

<style>
@media (max-width: 600px) {
  .my-class {
    display: none;
  }
}
</style>

当屏幕宽度<600px时，这个简单的例子会隐藏.my-class。您要做的是定义一个规则，如果屏幕低于特定边界，则对您的元素应用不同的CSS样式;如果屏幕大小高于边界，则应用“普通”样式的另一个规则。 如果您发布代码，我可以使用更具体的网站更新示例。