如何自動設置不同屏幕分辨率的網頁對齊方式？

Question

我在做一個關於ASP.NET的項目，我的決議是1280x800。我正在使用網頁的寬度爲1245px，該網頁在我的系統上運行得非常好，但是當我在分辨率1024x768上使用該網站時，對齊將從瀏覽器中退出。我正在使用<div>寬度1245px這在1280x800的分辨率上看起來不錯。
我試過這段代碼，但它給了我錯誤。

protected void Page_Load(object sender, EventArgs e) 
    { 
     div1.Style.Add(HtmlTextWriterStyle.Width, System.Windows.Forms.Screen.PrimaryScreen.Bounds.Width.ToString()); 
    } 

這是給錯誤

類型或命名空間名稱「視窗」不存在命名空間 「系統」存在（是否缺少程序集引用？）`

所以有什麼簡單的方法來解決它。

Answer 1

屏幕分辨率的問題是，除非您嘗試拍攝聖盃並使用液體佈局（a **中的痛苦），那麼您實際上不能真實地支持本機的不同屏幕分辨率。我想你可以使用很多花哨的javascript，但是...... OUCH ......和維護噩夢......再加上它會讓你的頁面停滯不前。

您應該將您的網站設置爲僅在1024 x 768的假定窗口中顯示內容，因爲這是迄今爲止最常見的屏幕尺寸。

完成此操作的一般方法是使用自動邊距將1024x768的div居中，以便剩下的只是額外的空白區域。

<div id="MainContainer"> 
My content here 
</div> 

    #MainContainer 
    { 
     width: 1024px; 
     height: 768px; 
     margin: auto; 
    } 

這不會解決垂直居中您的內容的問題。我更喜歡的一種方法是使用絕對定位，以便居中不是一個因素。我可以只設置頁面伸展通過使用此CSS代替以適合窗口大小：

#MainContainer 
    { 
     position: absolute; 
     top: 0; 
     bottom: 0; 

     width: 1024px; 
     height: 768px; 
     margin: auto; 
    } 

這將導致div來從窗口底部的頂部STRETCH時。 我喜歡這個解決方案，因爲它支持大多數瀏覽器及其各種版本，甚至可以很好地處理縮放。