javascript - Tachyons - 如何在横向屏幕上不显示任何内容

Question

我正在使用http://tachyons.io/并有一个图标。我只想在小型设备上显示该图标，但当它的横向模式也显示在小型设备上时。由于纵向的屏幕尺寸小于 480 像素，但如果我旋转，它在横向模式下超过 480 像素，这使得它按照 Tachyons 的“中等”尺寸。

我该如何处理这种情况？

我的场景示例：仅在小型设备上显示图标，在中型和大型设备上隐藏图标，在横向模式下 - 在小型设备上显示图标或设置可接受的显示宽度范围。

<div className="dn-ns">这意味着除了小型设备之外的所有设备上都不显示。

score 2 · Accepted Answer

听起来您应该使用“dn-l”，因为您只想在大屏幕上隐藏它。中小型屏幕应显示它。

<div class="dn-l"></div>

希望这可以帮助！

对于它的价值，我相信“类”是 HTML 属性定义的首选。

在 JSX 中使用“className”有几个原因，并且对于使用其他语言（如 JS）操作 DOM 很有用。

classList[.add() .toggle(), .remove()] 对于快子也变得超级有用！

document.getElementById('element-id').className = ''
document.getElementById('element-id').classList.add('' [,])

1 回答 1