我遇到此問題。我正在使用Firefox的默認響應擴展來爲我的網站創建響應式。當我開始在iPhone上檢查它時，它似乎沒有使用任何媒體查詢。我已經檢查過iPad並且問題不會發生。我已經檢查過類似尺寸的手機（如Galaxy S5），而且網站工作正常。iPhone未使用媒體查詢
我已經看過在谷歌，我看到人們建議增加：
<meta name="viewport" content="width=device-width, initial-scale=1">
到該網站的負責人，但這個已經存在，但仍然問題依然。
有什麼建議嗎？
感謝
這是我的CSS
@media (max-width: 400px) {
.mws-footer {
float: right;
margin-top: -4px;
margin-right: -9px;
width: 330px;
}
.mws-logo-footer {
float: none;
margin: -22px auto 0px;
}
.moduletable .twitter-feed-footer {
width: 290px;
float: left;
margin-right: 27px;
}
.moduletable.banner-overlay {
margin-top: -158px;
position: absolute;
width: 306px;
border-bottom: 1px solid #E4E4E4;
margin-left: -12px;
}
.mod-newsflash-adv.mod-newsflash-adv__pack .item {
margin-bottom: 30px;
float: left;
width: 110px !important;
height: 220px;
}
div#pwebcontact153_toggler {
margin-top: -40px;
width: 70px;
display: none;
}
#logo a {
margin: 0px 0px 20px;
width: 290px;
}
.search-block {
padding: 0px;
text-align: center;
margin-right: 20px;
}
#number {
float: left;
font-size: 28px;
color: #53296B;
margin-top: 18px;
margin-left: 50px;
}
.middle-footer {
float: left;
margin-top: 2px;
margin-right: 10px;
margin-left: 30px;
max-width: 300px;
}
.quick-quote-footer {
float: left;
margin-top: 2px;
margin-left: 17px;
margin-right: 190px;
}
.mws-footer {
float: right;
margin-top: -68px;
margin-right: 21px;
}
.about-us .mod-newsflash-adv.mod-newsflash-adv__pack .item {
margin-bottom: 50px !important;
width: 270px !important;
margin-left: 10px !important;
float: left;
}
.services-main-img {
float: left;
margin-right: 0px;
margin-bottom: 25px;
max-width: 285px;
}
.services-h1 {
font-family: Arial,Helvetica,sans-serif;
font-weight: normal;
line-height: normal;
background: none repeat scroll 0% 0% #53296B;
padding: 7px 10px;
text-rendering: optimizelegibility;
font-size: 23px;
float: left;
color: #FFF;
width: 265px;
height: 60px;
}
.service-side-imgs {
float: right;
margin-right: -15px;
max-width: 310px;
}
.service-imgs {
float: left;
margin-bottom: 16px;
width: 101px;
margin-right: 2px;
}
.services-bottom-imgs {
float: left;
margin-left: 5px;
margin-bottom: 25px;
width: 265px;
}
.previous-projects .span3 {
float: left !important;
width: 270px !important;
margin: 0px 0px 0px 8px !important;
}
.main-image {
width: 290px;
height: 162px;
margin: 15px 0px 5px -5px;
float: left;
}
.small-img-1 {
float: left;
margin-top: 15px;
margin-left: 5px;
width: 265px;
}
.small-img-2 {
float: left;
margin-top: 15px;
margin-left: 5px;
width: 265px;
}
.summary {
width: 240px;
margin: -30px 15px 15px 20px;
float: left;
font-size: 11px;
color: #666;
}
div#pwebcontact150_container {
background-color: transparent;
width: 275px;
float: left;
}
.moduletable.brochure-sample-slider {
width: 285px;
float: left;
margin: -30px 0px 30px;
}
div#pwebcontact158_container {
background-color: transparent;
width: 275px;
}
}
@media (max-width: 320px) {
#logo {
display: none;
}
.mws-footer {
float: right;
margin-top: -4px;
margin-right: -9px;
width: 330px;
}
.mws-logo-footer {
float: none;
margin: -22px auto 0px;
}
.moduletable .twitter-feed-footer {
width: 290px;
float: left;
margin-right: 27px;
}
.moduletable.banner-overlay {
margin-top: -158px;
position: absolute;
width: 306px;
border-bottom: 1px solid #E4E4E4;
margin-left: -12px;
}
.mod-newsflash-adv.mod-newsflash-adv__pack .item {
margin-bottom: 30px;
float: left;
width: 110px !important;
height: 220px;
}
div#pwebcontact153_toggler {
margin-top: -40px;
width: 70px;
display: none;
}
#logo a {
margin: 0px 0px 20px;
width: 290px;
}
.search-block {
padding: 0px;
text-align: center;
margin-right: 20px;
}
#number {
float: left;
font-size: 28px;
color: #53296B;
margin-top: 18px;
margin-left: 50px;
}
.middle-footer {
float: left;
margin-top: 2px;
margin-right: 10px;
margin-left: 30px;
max-width: 300px;
}
.quick-quote-footer {
float: left;
margin-top: 2px;
margin-left: 17px;
margin-right: 190px;
}
.mws-footer {
float: right;
margin-top: -68px;
margin-right: 21px;
}
.about-us .mod-newsflash-adv.mod-newsflash-adv__pack .item {
margin-bottom: 50px !important;
width: 270px !important;
margin-left: 10px !important;
float: left;
}
.services-main-img {
float: left;
margin-right: 0px;
margin-bottom: 25px;
max-width: 285px;
}
.services-h1 {
font-family: Arial,Helvetica,sans-serif;
font-weight: normal;
line-height: normal;
background: none repeat scroll 0% 0% #53296B;
padding: 7px 10px;
text-rendering: optimizelegibility;
font-size: 23px;
float: left;
color: #FFF;
width: 265px;
height: 60px;
}
.service-side-imgs {
float: right;
margin-right: -15px;
max-width: 310px;
}
.service-imgs {
float: left;
margin-bottom: 16px;
width: 101px;
margin-right: 2px;
}
.services-bottom-imgs {
float: left;
margin-left: 5px;
margin-bottom: 25px;
width: 265px;
}
.previous-projects .span3 {
float: left !important;
width: 270px !important;
margin: 0px 0px 0px 8px !important;
}
.main-image {
width: 290px;
height: 162px;
margin: 15px 0px 5px -5px;
float: left;
}
.small-img-1 {
float: left;
margin-top: 15px;
margin-left: 5px;
width: 265px;
}
.small-img-2 {
float: left;
margin-top: 15px;
margin-left: 5px;
width: 265px;
}
.summary {
width: 240px;
margin: -30px 15px 15px 20px;
float: left;
font-size: 11px;
color: #666;
}
div#pwebcontact150_container {
background-color: transparent;
width: 275px;
float: left;
}
.moduletable.brochure-sample-slider {
width: 285px;
float: left;
margin: -30px 0px 30px;
}
div#pwebcontact158_container {
background-color: transparent;
width: 275px;
}
}
請提供一個例子媒體查詢不工作，任何其他代碼，這有助於理解您的問題。 – Ronny
嗨Kieren，我們可能需要看到更多的代碼來確定問題嗎？你可以創建一個最小的例子，說明你不在測試什麼樣的iPhone模型？ – TZHX
該網站是：johnwright.multi-web-service.co.uk 使用的媒體查詢是：@media（max-width：320px）{ 但是媒體中的任何內容都無法在iPhone 5上工作.. –