當在CSS中使用較低的分辨率時，寬度不會改變

@media screen and (min-width: 300) and (max-width: 800px) { 
#top { 
    font-size: 200%; 

} 
#first { 
    width: 30%; 
    height: 20%; 
    font-size: 120%; 
    position: relative; 
    top:40%; 
} 
#second { 
    float: right; 
    width: 30%; 
    height: 20%; 
    font-size: 120%; 
    position: relative; 
    top: 20%; 

} 
#quote { 
    position: relative; 
    left: 10%; 
} 
#bannertextb{ 
    font-size: 250%; 
    margin-left: 0; 

} 
#sps { 
    font-size: 180%; 
    position: relative; 
    top: -08%; 
    margin-left: 0; 
} 
#class { 
    margin-left: 0; 
} 
#greek { 
    font-size: 350%; 
    margin-left: 0; 
} 
#banner { 
    height: 30%; 
} 

}

我希望改變從手機打開時的寬度。但這似乎不會發生。但是，當我重新大小我的瀏覽器窗口中，一切工作正常.. 您可以查看整個網站@ - This link 當在CSS中使用較低的分辨率時，寬度不會改變

來源

2014-01-21 user3217999

減少最小和最大寬度，那就試試吧。

來源

2014-01-21 06:52:58

嘗試在您的html的<head>內使用此標記。

<meta charset="utf-8" content="width=device-width, minimumscale=1.0" name="viewport">

來源

2014-01-21 06:56:06 noob

使用下面的代碼，而不是你media query

@media screen and (min-device-width: 300px) and (max-device-width: 800px){ 
//your code goes here 
}

來源

2014-01-21 07:04:56

使用這樣 @media屏幕（最大寬度：800像素）

來源

2014-01-21 07:28:46 MRMK

當在CSS中使用較低的分辨率時，寬度不會改變

回答

相關問題