媒體查詢：在高度和寬度達到一定大小時執行

有沒有辦法，例如，當瀏覽器被拖動到一定大小（比如200px x 200px）時，改變背景色。當它的寬度爲200或200，但我希望它只有在瀏覽器寬度爲200，高度爲200時纔會改變。我怎樣才能組合這兩個查詢，使它不是一個或兩個，而是一個和。媒體查詢：在高度和寬度達到一定大小時執行

這裏是代碼，我需要將它們合併爲1個查詢，該查詢在滿足兩個要求時都起作用。

@media screen and (max-height: 500px) and (min-height: 490px) { 
    p{ 
     color: red; 
    } 
    body{ 
     background-color: blue; 
    } 
@media screen and (max-width : 300px) and (min-width: 290px) { 
    p{ 
     color: yellow; 
    } 
    body{ 
     background-color: green; 
    }

希望是十分明顯的，很多感謝

來源

2012-11-21 peyroux

「我知道了，當它是200寬度或200高空作業」是什麼代碼？ – BoltClock

你的CSS是無效的;）和我寫下了相同的答案：D太晚 – 23tux

當然可以。您必須將查詢與and結合。我創建了一個搗鼓你在這裏http://jsfiddle.net/HChTD/

更新

這裏是一個範圍之間。例如：http://jsfiddle.net/HChTD/1/

來源

2012-11-21 10:24:38 23tux

太棒了！我如何調整您的查詢，使其有一個小的機會來工作。例如：只有當瀏覽器的寬度在480-490px和480-490px之間時，框纔會變藍。因此，用戶必須將其瀏覽器移動到相當特定的大小才能工作。 – peyroux

我已經更新了我的答案 – 23tux

你是最棒的！我只是無法弄清楚爲什麼我自己無法工作，查詢中的順序是否重要？你的寬度，高度，寬度，高度 - 而當我嘗試時，我做了高度，高度，寬度，寬度。無論如何，它的功能非常完美，非常感謝你！ – peyroux

媒體查詢：在高度和寬度達到一定大小時執行

回答

相關問題