爲什麼我的網站不響應我的瀏覽器窗口的大小？

Question

我在CSS中創建了一個包含媒體查詢的頁面，以便它能夠響應設備的視口。

當我使用Firefox Web開發工具進行響應式設計時，我可以看到我的網站如何反應。但是，當我調整我的瀏覽器我不能。

http://champlain.torqueweb.com/html/Responsive1.html

我應該用我的元不同的價值？

Answer 1

最大設備寬度應該是：

最大寬度

作品，我測試它

Answer 2

您在樣式表中使用了固定寬度。

F.i.

nav { 
width:1024px; <<<< prevents responsiveness as the width will be fixed 
height:40px; 
font-family: Arial; 
margin: 0 0 10px 0; 
list-style: none; 
background-color: #000033; 
} 

這些固定寬度在您的媒體查詢（即@media ...）中不會重置。

要麼在媒體查詢中進行修改，要麼在不需要固定寬度或高度的情況下仍然更好地使用％或em電子郵件。

F.i.

nav { 
width:100%; <<<< will resize to the max available width 
height:40px; 
font-family: Arial; 
margin: 0 0 10px 0; 
list-style: none; 
background-color: #000033; 
} 

Answer 3

點1是你爲中心的頁面，我認爲我們不應該居中的頁面了（我指的是整個身體的事情，甚至是容器）的自適應網頁設計......

就像你沒有真正定義寬度屬性一樣，瀏覽器會假定它是自動的，所以頁面會遍佈瀏覽器窗口。

也許應該是有益的（不要評判我，我不是很有經驗：O）