超過1000px屏幕分辨率的響應式設計

我使用Dreamweaver CC使我的網站響應。我在屏幕尺寸超過1000像素時遇到問題。超過1000px屏幕分辨率的響應式設計

在Dreamweaver中，響應式網頁設計底部有三個選項，桌面爲1000px或更少，平板電腦768px或更少，移動480px或更少。所以我的網站在所有這些設置下看起來都很棒，這意味着它看起來很好，只有1000px的少。但我家的屏幕是1680 x 1050像素，所以當我全屏查看我的網站時，導航欄比頂部的標題橫幅圖片長。

有沒有辦法阻止網站超過1000px？即使在1680 x 1050的寬屏上查看該網站，該網站只會保留1000像素，並且可能會在兩側填充一些空白空間？或者我應該只用1600px的橫幅構建網站？

來源

2015-04-04 Jade

所以，你說導航條比橫幅圖像寬嗎？問題在於，如果將橫幅圖像製作得像屏幕尺寸一樣寬，則看起來會拉長。 – Phantom 2015-04-04 05:59:57

這真的不是我認爲與響應式設計相關的東西，而是更多沿着大屏幕偏好的線條。所有響應式設計都適用於大屏幕。

理想情況下，您可以有一個包裝div，並應用最大寬度。你也可以去舊學校，只適用於身體，但可能不是一個好主意。

<body> 
    <div class="site-wrapper"> 
    ...rest of website... 
    </div> 
</body>

用下面的css來解決你的問題。只允許.site-wrapper增長到1000px，並且兩邊的邊距相等。

.site-wrapper { 
    max-width: 1000px; 
    margin: 0 auto; 
}

這是一個jsbin，當在1000px以上查看時，您可以看到應用於身體的紅色背景。

http://jsbin.com/mifolecahi/1/edit?output

框架像引導用容器類只具有內容達到一定的寬度。這允許父容器擴展全部寬度。這也可以在jsbin的頁腳中看到。

來源

2015-04-04 07:35:17 Ace

王牌，你真是太棒了！非常感謝您以這樣的精度和細節回答我的問題！我真的很感謝你的幫助:) – Jade 2015-04-04 12:37:02

@Jade沒問題！只是將答案標記爲接受:) – Ace 2015-04-05 07:05:27

超過1000px屏幕分辨率的響應式設計

回答

相關問題