Css 如果有空间，则不显示表格标题，但如果这会破坏布局，则不显示

我有一张桌子。我希望标题文本不换行，我可以使用空白nowrap

然而，我的布局是响应。在较小的宽度下，此nowrap将打破布局，使桌子比其容器更宽

当有足够的空间时，如何使表标题不换行，但如果不换行，则会使表比其容器更宽

---

您只需使用简单的媒体查询即可：

// Mobile only
@media screen and (max-width: 599px) {
    // Wrap
}

// Everything else
@media screen and (min-width: 600px) {
    // No wrap
}

---

@jdln移动设备上的表总是会出现问题。我建议大家看看这个：布局在900px左右，所以这个问题并不局限于移动设备。由于我的内容是动态的，我需要一个非常健壮的解决方案。从技术上讲，900px宽被认为是一种“移动设备”，你必须记住，它还包括平板电脑，而不仅仅是手机。桌面设备通常是1024px以上。回到我说的那一点，你有一个很宽的桌子，里面有很多内容，你正试图找到一种方法，把它放在一个900像素宽的屏幕上。这不是一个实用的方法，这就是为什么你必须考虑响应表。当宽度大约900px时，我想保持我的3栏布局，并且有足够的空间让我这样做。你建议我切换到基于单列的布局，主要是为320px左右的更小屏幕设计的。