如何在大屏幕上不显示网站内容

Question

我不希望在大于1600px的屏幕尺寸上显示网站内容。对于更大的屏幕尺寸，我想只显示一些图像显示一些消息。我怎样才能做到这一点？

Answer 1

首先认真问自己为什么，我敢肯定有一个在你的使用情况良好的原因，但可以肯定的，那么：

使用media queries和显示值：

@media (max-width: 1600px) { 
    /* site styles in here */ 
    .big-image { 
     display: none; 
    } 
} 

@media (min-width: 1601px) { 
    .page-container { 
     display: none; 
    } 
    .big-image { 
     display: block; 
     /* more image styles here */ 
    } 
} 

这里.page-container拥有一切你想隐藏它。 .big-image适合您的图片。显示属性取决于视口的大小。