網站開發(fā)：如何讓網頁自適應電腦屏幕分辨率？

網站開發(fā)：如何讓網頁自適應電腦屏幕分辨率？

網站開發(fā)很多人會遇到這樣的問題，當你自己的電腦上精心制作好網頁，卻發(fā)現(xiàn)在他人的不同分辨率的電腦上瀏覽你頁面時，自己的網頁排版亂得一塌糊涂，或者被拉伸，或者被壓縮，要不就是不能完整顯示在屏幕內。這是為什么呢？因為通常初學者朋友都按照自己的屏幕分辨率對網頁進行設計，但是卻沒有考慮到網友們可能使用了別的屏幕分辨率。

目前，網友們上網通常會采用8006001024768兩種分辨率，由于網頁不是用來給自己看的所以我必需讓自己的網頁能夠兼顧這兩種情況，讓不同分辨率設置的網友都能夠看到一個排版美觀正確的網頁。下面就介紹幾種常用的方法，特別說明一下除非你網站是藝術類的有特別需求，通常我都會首先照顧分辨率設置為800600大眾化規(guī)范。
網站開發(fā)一、自然拉伸

如果你網站結構沒有用到大量的圖形來銜接，主要由表格來定結構，那么你就可以使用該方法。非常適用于主要由表格、文字來表達信息的簡單的網頁頁面。制作表格時，只要你把表格的寬度屬性定義為100%表格就會根據分辨率的不同自行調整寬度。

網站開發(fā)二、固定居中
800600分辨率下制作的網頁在1024768分辨率的機器上打開，整個網頁就會跑到左邊；1024768分辨率的網頁在800600分辨率的機器上有時也會變得"不堪入目"兩種分辨率各做一個吧？做起來費勁。所以目前普遍采用的方法是固定居中法！
現(xiàn)在大多數(shù)網民都還在用800*600分辨率，所以我一般可以以此分辨率為主。只要在網頁原代碼的后緊加一句前加一句

就OK不過有幾個問題這是要注意一下，第一個要注意的上面說到百分比的問題，表格、單元格的寬度單位最好要使用像素單位，而不要用百分比。例如width=770如果你表格寬度設的百分比，那么使用大于800600像素時，網頁就會拉寬，這樣網頁可能會變形。中加入leftmargin=0即這種情況下，800600支持的表格寬度為780像素時不會出現(xiàn)滾動條。還有一點要注意的不能用DW中的層來定位。

網站開發(fā)三、兵分兩路
如果你網頁不經常更新，而且對頁面效果極其在意，那好，就設計兩個頁面，分別對應800600和1024768兩種分辨率。然后根據不同的分辨率進行跳轉就行了
例如：
functredirectPag{
varurl_els="http://www.163.com/";
varurl_800x600="http://www.sohu.com/";
varurl_1024x768="http://www.sina.com.cn/";
varurl_1366x768="http://www.qq.com";
ifscreen.width==800&&screen.height==600
window.location.href=url_800x600;
elsifscreen.width==1024&&screen.height==768
window.location.href=url_1024x768;
elsifscreen.width==1366&&screen.height==768
window.location.href=url_1366x768;
else
window.location.href=url_else;

}

文章標題：網站開發(fā)：如何讓網頁自適應電腦屏幕分辨率？
本文來源：http://www.bm7419.com/news25/224075.html

成都網站建設公司_創(chuàng)新互聯(lián)，為您提供軟件開發(fā)、外貿網站建設、網站內鏈、品牌網站制作、標簽優(yōu)化、企業(yè)建站

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)