媒体查询无法在移动设备

时间:2016-08-03 07:12:52

标签: html css media-queries

我目前正在开发一个应该根据屏幕大小在不同样式表之间进行更改的网站。当我在我的笔记本电脑浏览器上测试它时,它可以很好地工作,当我调整浏览器窗口的宽度时更改样式,但它在我的手机上不起作用。我只得到桌面样式表,我不知道为什么。我用来查看该网站的手机是三星Galaxy S4,在Firefox和Chrome上看起来都是一样的。

<link rel="stylesheet" type="text/css" media="screen and (min-width:1200px)" href="css/styles_desk.css">
<link rel="stylesheet" type="text/css" media="screen and (min-width: 768px) and (max-width: 1024px)" href="css/styles_tablet.css">
<link rel="stylesheet" type="text/css" media="screen and (min-width: 320px) and (max-width: 480px)" href="css/styles_mobile.css">

1 个答案:

答案 0 :(得分:3)

确保设置了视口

<meta name="viewport" content="width=device-width, initial-scale=1.0">