Foundation CSS 可见性
根据屏幕尺寸显示元素
以下类会根据设备(屏幕尺寸)来显示元素。
类 描述
.show-for-small-only 只在小型设备上显示元素 (屏幕宽度小于 40.0625em )
.show-for-medium-up 在中型及以上设备上显示元素 (屏幕宽度大于 40.0625em)
.show-for-medium-only 只在中型设备上显示元素 (屏幕宽度在 40.0625em 到 64.0625em 之间)
.show-for-large-up 在大型及以上设备上显示元素 (屏幕宽度大于 64.0625em)
.show-for-large-only 只在大型设备上显示元素 (屏幕宽度在 64.0625em 到 90.0625em 之间)
.show-for-xlarge-up 在更大型及以上设备上显示元素 (屏幕宽度大于 90.0625em)
.show-for-xlarge-only 只在更大型及以上设备上显示元素 (屏幕宽度在 90.0625em 到 120.0625em之间)
.show-for-xxlarge-up 在超大型及以上设备上显示元素 (屏幕宽度大于 120.0625em)
以下实例演示了以上所有 .show- 类的可见性。
你在小型设备上。
你在中型、大型、更大型、超大型的设备上。
你在中型设备上。
你在大型、更大型、超大型的设备上
你在大型设备上。
你在更大型、超大型的设备上。
你在更大型设备上。
你在超大型设备上。