元視口對媒體查詢沒有影響

我正在嘗試編寫一個功能，使用戶能夠在移動和桌面佈局之間切換。我正在使用媒體查詢區分佈局：元視口對媒體查詢沒有影響

@media screen and (max-width: 1024px) { 
    .... some definitions 
}

我的理解是，VIEWPORT META標記應該會影響媒體查詢。所以，我覺得這

<meta name="viewport" content="width=640" />

應該引起我的病情積極評價

@media screen and (max-width: 1024px)

不幸的是，事實並非如此。我錯了嗎？如果是，有沒有辦法，如何影響媒體查詢？

來源

2016-11-28 user3523426

這個問題的一個變種之前已經被問到：http://stackoverflow.com/questions/14706011/strategies-for-switching-between-desktop-and-mobile-version-of-the-website。通過jQuery/javascript向添加和減去一個類可能是最簡單的，然後爲每個類分別設置不同的類。這取決於你當前的代碼是如何設置的。 –

另一種方法是刪除元視口標記，如果用戶想要強制網站的桌面版本，並將其添加回來以顯示移動版本https://css-tricks.com/user-opt-out-responsive-design/ –

彌敦道 - 感謝提示和鏈接。我主要問了關於視口META和媒體查詢之間的關聯，因爲我很驚訝，我的媒體查詢不受影響。切換是另一個話題，正如你所提到的那樣，這在互聯網上是非常好的。 Quentin解釋說， – user3523426

我的理解是，VIEWPORT META標記應該會影響媒體查詢。

只在支持它的瀏覽器中。桌面瀏覽器通常不會。

如果您希望桌面瀏覽器使用CSS，您通常只需要較小的屏幕，那麼最好的方法是使用兩個單獨的<link>元素並使用media屬性指定您的媒體查詢。然後使用JavaScript更改媒體查詢以匹配顯示器（而不是顯示器以匹配媒體查詢）。

來源

2016-11-28 10:08:04 Quentin

元視口對媒體查詢沒有影響

回答

相關問題