如何控制媒体查询?

时间:2017-10-07 19:55:14

标签: html css media-queries responsive

我试图让我的网站响应,但每当我调整浏览器大小时,内容就会开始变化并变得混乱。我试图修复它,但我需要修复每个可能的维度,因为例如我设置了432px的媒体查询,当我将其调整为440px时,我在某处有一个额外的不需要的空白区域。我使用vh和vw表示div和容器,使用%表示定位。无论如何,我必须将媒体查询设置到每个新维度,如果没有,请告诉我是否有一个技巧,以避免这种额外的努力工作。

1 个答案:

答案 0 :(得分:0)

您可以创建4个不同的媒体查询,例如某些Twitter Bootstrap框架

//For extra small devices, phones
@media (max-width: 480px)

//For small devices, tablets
@media (max-width: 768px)

//For medium devices, desktops
@media (max-width: 992px)

//For large devices, wide screens
@media (max-width: 1200px)