如何根据父元素大小更改元素可见性

Question

我正在寻找类似于媒体查询的解决方案，它将根据元素大小而不是视口大小工作。例如：

---

对于宽度最小为400px的容器，可以看到DIV A.

---

DIV A在其父元素宽度小于400像素时被隐藏

这可以在不使用JavaScript的情况下完成吗？

Answer 1

您可以在css文件中使用媒体查询：

@media (max-width 399px) {
    .divA {
        display: none;
    }
}

如果父div是屏幕的宽度（即容器），这应该有效。否则你可能需要使用javascript。希望这有帮助！