網頁布局離不開對分辨率的設置，網頁分辨率應該設多少才是合理的？檸檬盛世設計師就來為大家詳細講解一下。

網頁分辨率的設置通常與屏幕分辨率密不可分，在15存大腦袋的CRT顯示器時代，最常用的屏幕分辨率為 800×600，后來發展到17寸方屏液晶顯示器，較為常用的屏幕分辨率為 1024 × 768，科技發展到今天，屏幕的種類已越來越多且以寬屏為主，可用分辨率有 1280 × 720 、1440 × 900（19寸寬屏主流）、1920 × 1080 等多種。

一般在網頁制作時，網頁分辨率的寬度不能超過屏幕分辨率，但對高度沒有限制，以 1024 × 768 為例，考慮到要留出瀏覽器垂直滾動條的寬度，一般網頁寬度定為 1002 像素，而高度不限。這樣只要客戶使用17寸以上的屏幕瀏覽網頁時，當瀏覽器最大化的時候，就不會出現橫向滾動條。

常用的屏幕分辨率所對應的網頁分辨率如下：

1. 800×600 屏幕（15寸方屏），推薦網頁寬為 778 像素

2. 1024 × 768 屏幕（17寸液晶），推薦網頁寬為 1002 像素

3. 1280 × 720 屏幕，推薦網頁寬為 1258 像素

4. 1440 × 900 屏幕（19寸寬屏液晶），推薦網頁寬為 1418 像素

5. 1920 × 1080 屏幕，推薦網頁寬為 1898 像素

可能你會說，你也不確定你的訪客到底用什么樣的屏幕瀏覽網頁，但你還是希望網站能適應絕大多數瀏覽者的屏幕，怎么辦？我們這里推薦兩個方案：

1. 直接以 1024 × 768 屏幕為準進行網頁制作

因為要適應大部分客戶，我們知道現在幾乎沒有人用15寸大腦袋顯示器了，可能部分人還在用17寸液晶屏，但現在市場的主流的是19寸屏幕，因此我們以17寸屏幕為準，制定網頁寬度為 1002 像素，則可以適用所有比17寸大的屏幕，只是屏幕越大，瀏覽器左右兩側留白的部分將越大。

2. 設置網頁寬度相對屏幕寬度的百分比，自適應屏幕

這種方法是在制作網頁時，直接將頁面寬度設置一個百分數，例如 98%，則它在任意屏幕中，都是以屏幕寬度 * 98% 的計算方式來算出網頁寬度的，可以說是自動適用屏幕寬度，而不會出現瀏覽器左右留白。但這種方式的缺點在于，網頁內部的版塊、圖片等寬度也都有自動適應網頁寬度，操作上有一定難度。

下面通過一段 html 代碼來了解如何設置網頁分辨率

 
  
    網頁分辨率設置