屏幕小於768像素的媒體查詢問題
[英]Media query issues with screens smaller than 768px
問題描述
好的..所以這是我頭腦中的代碼
<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 ..我不明白這個問題...
2 個解決方案
解決方案1
3 已采納 2013-07-09 05:40:35
當屏幕尺寸低於640px時，您尚未設置樣式表
only screen and (min-width:640px) and (max-width:768px)
此聲明表示媒體應為電子媒體，寬度大於640px，但小於768px
看看你如何將這個文件命名為phone，我認為你希望這個用於小型設備。 如果是這種情況，只需刪除(min-width:640px) 。 這將設置樣式表中的樣式，以便在寬度低於768px（包括iPhone）時應用
解決方案2
0 2013-07-09 07:51:38
你可以使用percantage值例如你有640x640分辨率的屏幕; 如果你設置width:100%你的寬度值是640px，或者你的分辨率是1280x1280，那么寬度值是1280px
為什么我的搜索字段會在小於768像素的屏幕上下拉一行？
[英]Why does my search field drop down a line on screens smaller than 768px?
為什么@media only screen and (min-width: 768px) 也適用於屏幕寬度小於768px
[英]why @media only screen and (min-width: 768px) also apply for screen width less than 768px
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.