1、不同解析度下,網頁製作中常見的頁面尺寸是多少?
對於一個設計人來員來說,沒自有什麼固定的東西。就是一種習慣,好的習慣
現在的顯示器解析度都在1024*768以上了。800*600基本全部被淘汰掉了。
1024*768下。全屏下採用1003px寬就好了。
面對現在的顯示解析度大部分是960px寬的
當然還有很多是採用800px寬的
一個網頁的寬度。根據實際要做的頁面而定。
不要局限在一個標准內。
2、網頁設計時遇到的解析度問題,如何解決
這位網友你好,你可以將圖片寬度設置為100%,或者將圖片設置為背景。這兩種方法都可以達到你的要求。
3、網頁設計中,如何讓網頁能在不同的解析度下都全屏顯示?
定義一個整體的DIV把寬度設置哦100%就可以了,如果裡面有幾列的話,首先確定哪幾個地方固定大小,哪先地方能縮放!根據情況定吧!
4、網站設計中如何設置網頁尺寸使在不同解析度下都能正常顯示
目前沒有見過十分有效的辦法,常見的是採用最小的解析度的情況先全屏顯示,大分辨的話居中顯示。也有些採用「魔術」顯示,或者是用js識別,js更改屬性顯示但是這種方法非常的麻煩。
5、剛學網頁設計,如何解決解析度不同,顯示不同的問題
做一個表格760PX的居中顯示就可以了
6、網頁因解析度不同而變形
第一種方法:做一個網頁解決問題(長了點)
如果只是因為瀏覽者改變了瀏覽器的設置,或者因為瀏覽器不兼容,使自己精心製作的網頁變得"面目全非",那多令人沮喪!下面我們以網頁愛好者的常用工具Dreamweaver(以下簡稱DW)為例,列出幾個網頁製作初學者較常見的網頁布局問題以及解決方法,希望對初學者們有所幫助。
一、消除任意縮放瀏覽器窗口對網頁的影響
一番辛苦做出來的網頁,在全屏狀態下瀏覽一切正常。但在改變瀏覽窗口大小之後,網頁就變得"不堪入目"了,這是個很值得注意的問題。
問題的根源還得從網頁的布局說起,在DW中,網頁內容的定位一般是通過表格來實現的,解決表格的問題也就成功了大半。
大家應該注意到,在DW中表格屬性面板的高寬設定選擇上提供了兩種不同類型:百分比和像素值。百分比的使用將會產生前面說到的那個毛病。這里所說的百分比是指表格的高或寬設置為上層標記所佔區域高或寬的百分比,如在一個表格單元的寬度是600,在它裡面嵌入了另外一個表格,表格寬度占表格單元的50%,則這個表格的寬度為300,依此類推,如果在一個表格不是嵌於另一個表格單元中,則其百分比是相對於當時窗口的寬度的。IE瀏覽器中,隨便改動主頁窗口的大小時,表格的內容也隨之錯位、變形,就是因為表格的百分比也要隨著窗口的大小而改變成相應的百分比寬度。
自然,解決這個問題的辦法就是將表格寬度設置成固定寬度(也就是像素值)。另外如果外層表格已做好固定寬度設置,內層表格也可以適當使用百分比設置。清楚這個原則以後,如果出現類似的問題大家也知道怎麼解決。
二、讓網頁居中
說到了窗口大小就會順著路子想到解析度的問題,在800×600解析度下製作的網頁在1024×768解析度的機器上打開,整個網頁就會跑到左邊;1024×768解析度的網頁在800×600解析度的機器上有時也會變得"不堪入目"。兩種解析度各做一個吧?做起來費時,看起來也費勁。怎麼辦呢?
現在大多數網民都還在用800*600的解析度,所以我們一般可以以此解析度為主,要想讓網頁在1024*768時居中,只要在網頁原代碼的<body>後緊加一句<center>,</body>前加一句</center>就OK了。不過有幾個問題這是要注意一下,第一個就是上面說到的百分比的問題,表格、單元格的寬度單位最好要使用像素單位,而不要用百分比。例如width=770。如果你的表格寬度設的是百分比,那麼使用大於800×600的像素時,網頁就會拉寬,這樣網頁可能會變形。在<body>中加入leftmargin=0,即<body leftmargin=0>這種情況下,800×600支持的表格寬度為780像素時不會出現滾動條。還有一點要注意的是不能用DW中的層來定位。
<html>
<head></head>
<body topmargin=0 leftmargin=0>
<center>
<table cellspacing cellpadding width=760><tr><td></td></tr></table>
</center>
</body>
</html>
三、定義固定大小的文字
大家都知道,在IE瀏覽器的功能設置中,有一個可以自由設置窗口內容字體大小的功能,這樣由於不同訪問者的設置習慣不同,呈現在他們面前的網頁有時也會不不相同。比如你可能本來設計時用的是2號字體,結果由於用戶對瀏覽器的額外設定,變的更大了,這時你的網頁也可能變得"不堪入目"。雖然不是你的錯,但客戶是上帝。
如果使用了網頁中的CSS樣式表技術,就不會出現上述情況了。使用快捷鍵"Shift+F11"打開樣式表"CSS style"編輯器,在窗口中單擊滑鼠右鍵執行"New CSS style..."命令新建一個樣式表,然後在給出的列表中選擇"類型"選項,定義文字屬性參數(一般文字的大小選擇12px較為適宜)。完成後選擇網頁編輯窗中的文本,單擊新的樣式表名稱,可以看到選中的文本發生了變化。預覽時試試定義的文本字體尺寸還會不會隨瀏覽器的選擇字體大小而改變。
四、讓網頁適應不同的瀏覽器
瀏覽器的格局現在是兩分天下,一分是IE,另一分是NetScape,在國內Ie有絕對的佔有率,在這種情況下我們設計的網頁只要兼容它就行了,但NetScape在國外還是有很多人使用,畢竟它是瀏覽器的元老。
雖然沒有辦法做出讓所有瀏覽器都兼容的網站,但只要注意以下幾點,做出來的網頁在各個瀏覽器都中能達到比較好的顯示效果:
不要混合使用層和表格排版,如果是父子關系,如層中表格,不在此原則范圍內。
內聯式的 CSS 在 Netscape Navigator 中經常會出現問題,使用鏈式或內嵌式。
有時需要在空層插入表格或者透明圖片,以保證在 Netscape Navigator 里的效果。
對於只有幾個像素寬度或高度的層,改用圖片來實現。
避免使用 W3C 組織不推薦的排版屬性,用 CSS 代替。
第二種方法:做兩個適合不同解析度的頁面
一個是800×600,一個是1024×768,在800×600的頁面中加入一下代碼就可以實現跳轉了:
---------------------------------------------------------------
解決解析度問題在Dreamweaver中沒有此項功能,我們只能手動加入一段Javascript代碼。首先在change-ie.html或change-nc.html頁面代碼中的< head>和< /head>中加入以下代碼:
< script language=JavaScript>
< !--
function redirectPage(){
var url800x600=〃index-ie.html〃; //定義兩個頁面,此處假設index-ex.html和1024-ie.html同change-ie.html在同一個目錄下
var url1024x768=〃1024-ie.html〃;
if ((screen.width==800) && (screen.height==600)) //在此處添加screen.width、screen.height的值可以檢測更多的解析度
window.location.href= url800x600;
else if ((screen.width==1024) && (screen.height==768))
window.location.href=url1024x768;
else window.location.href=url800x600;
}
// -->
< /script>
然後再在< body…>內加入onLoad=〃redirectPage()〃
最後,同樣地,在< body>和< /body>之間加入以下代碼來顯示網頁的工作信息:
< script language=JavaScript>
< !--
var w=screen.width
var h=screen.height
document.write(〃系統已檢測到您的解析度為:〃);
document.write(〃< font size=3 color=red>〃);
document.write(w+〃×〃+h);
document.write(〃< /font>〃);
document.write(〃正在進入頁面轉換,請稍候…〃);
// -->
< /script>
7、不同網站網頁顯示圖片解析度有不同嗎?
網頁會對你上傳的圖片進行壓縮,主要目的是為了節省網頁容量。例如傳一張千萬像素的.BMP,大小為10M,如果一個頁面有10張這樣的「偉大作品」,那麼歡呼吧!即使是1M一秒的網速也得等兩分鍾。
而壓縮過的JPG圖片充其量也是幾百K一張(就很清楚了)。如果你遇到打開圖片是一絲一絲的載入,那就是原圖片,是非常清晰的。不過通常是單獨展示一張圖片的網頁才這么干。不同的網站伺服器也不同,一些大網站財力雄厚,可以租用更大的伺服器來保障速度。小網站只能悲劇了。
另外外國的網路比較好,不像天朝的那麼浮誇。20M寬頻速度才100k……如果等待了3、5秒沒載入好,用戶就失去耐心了。所以網站必須要保障頁面容量適中。唉,這個是很深奧的商業原理,不說了。反正統一標準是沒有的,壓縮多少取決於網站的策略和網頁類型。
8、關於網頁製作大小與解析度的關系
很簡單,大框架用百分比寫比如頭上的橫幅與頁尾的說明寬度寫成100%,這樣你解析度越高寫的東西就越大解析度越小寫的東西就越小達到自適應的效果,後續不會的可以追問我
9、為什麼電腦桌面解析度和網頁解析度不一樣
1、首先,桌面是操作系統給我們提供的人機交互的界面,這個界面需要內顯示屏來承載,所以設置桌容面解析度就是設置顯示器的解析度。
2、而網頁是網頁瀏覽器的一個人機交互界面,而網頁瀏覽器又是運行於操作系統的一個程序,在網頁瀏覽器又有菜單欄、導航欄、狀態欄、滾動條等內容顯示,所以,網頁瀏覽器的解析度寬度不會比桌面解析度大,只能比桌面解析度寬度小,如果網頁解析度比桌面解析度相等或大,都會產生水平滾動條,只有水平滾動頁面才能瀏覽完全,網頁解析度的高度大多比顯示器解析度高,這樣網頁才能承載更多的內容,我們在瀏覽網頁時才能只拖動垂直滾動條,或用滑鼠滾輪快速的瀏覽網頁的內容。
下圖里的紅色區域的寬度就是網頁的寬度解析度:
3、總之,網頁的寬度解析度一般比桌面解析度的寬度小,而且一般網頁解析度的設置會考慮到絕大多數用戶終端的顯示器都能得到完整的寬度顯示,所以一般會採用較低解析度的顯示器為標准進行網頁設計的,高度解析度根據網頁的性質可以比桌面的解析度大,也可以比桌面解析度小。