寬度和高度流動設計

http://www.juliabailey.com/寬度和高度流動設計

這個網站有流體設計和它的工作非常漂亮。

這是我的網站。流體視圖取決於寬度。因此，當我的瀏覽器更大的寬度變得更大和更高時。但問題是高度太大，創建我不想要的滾動條。我不會在我的頁面上顯示滾動條。我認爲最好的方式是依賴於高度的流暢視圖，因此無論瀏覽器是800x600還是1600x1200，它都適合瀏覽器。我該怎麼做？

這是我的包裝代碼;

#wrapper { 
    width:auto; 
    height:auto; 
    width:80%; 
    min-width:550px; 
    max-width:1150px; 
    margin:50px auto 0 auto; 
    z-index:100; 
    }

來源

2012-05-11 user1388431

使用百分比表示您的類的屬性。例如：

wrapper { 
width: 92%; 
} 
content { 
width: 73%; 
} 
sidebar { 
width: 25% 
}

類型的事物或

你也可以使用JavaScript來檢測你需要什麼，然後動態地改變實現。有點像這個

function dynamicLayout(){ var browserWidth = getBrowserWidth(); 
    // Narrow CSS rules 
if (browserWidth < 640){ changeLayout("narrow"); } 
    // Normal (default) CSS rules 
if ((browserWidth >= 640) && (browserWidth <= 960)){ changeLayout("default"); } 

    // Wide CSS rules 
if (browserWidth > 960){ changeLayout("wide"); } }

在你的榜樣

，你有一個最小寬度屬性，這意味着如果它是小於，你將有滾動條。如果您不想滾動條，則無法將任何靜態值設置爲任何佈局元素，因此它可能會彎曲到瀏覽器窗口大小。

來源

2012-05-11 01:48:57 jsteinmann

http://www.juliabailey.com/看看這個網站。無論使用什麼瀏覽器或分辨率，盒子都會一直存在。然後看看我的。我拿出最小 - 最大它仍然使滾動條出現..我認爲在該設計中，他們以某種方式使用了高度屬性。 – user1388431

使用min-height和max-height，因此瀏覽器在到達它們時停止縮放。您樣本的滾動條始終可見，即使它是「空的」，這就是爲什麼在調整大小時不會跳轉。

來源

2012-05-11 03:07:40 Yisela

可見，但沒有任何滾動，你不會在頁面上下載 – user1388431

寬度和高度流動設計

回答

相關問題