1

好的..所以这是我脑海中的代码

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Eddy Gann: Designer</title>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="viewport" content="width=device-width">
<!-- main -->
<link href="main.css" rel="stylesheet" type="text/css" media="only screen and (min-width:768px)">
<!-- phone -->
<link href="phone.css" rel="stylesheet" type="text/css" media="only screen and (min-width:640px) and (max-width:768px)">
</head>

main.css 显示正常。当我调整窗口大小或在 iPhone 上查看时,它根本不显示任何 CSS。我已经尝试放入“main.css”,但它仍然只是停止在 768px 以下的屏幕尺寸显示任何 CSS .. 我不明白这个问题......

4

2 回答 2

3

当屏幕尺寸低于 640 像素时,您还没有设置样式表

only screen and (min-width:640px) and (max-width:768px)

此声明意味着媒体应该是电子的,宽度大于 640 像素,但小于 768 像素

看到您如何将文件命名为电话,我假设您希望它适用于小型设备。如果是这种情况,只需删除(min-width:640px). 这会将样式表中的样式设置为在宽度低于 768 像素时应用,其中包括 iPhone

于 2013-07-09T05:40:35.987 回答
0

您可以使用百分比值例如您有 640x640 分辨率的屏幕;如果您设置width:100%宽度值为 640px,或者如果您的分辨率为 1280x1280,则宽度值为 1280px

于 2013-07-09T07:51:38.013 回答