Web Design

網頁設計

首先建立幾个HTML文件：
index.html--網站主頁，對瀏覽器進行辨别。
change－ie.html和change－nc.html--對分辨率進行辨别的網页。
index－ie.html和index－nc.html--分别代表支持兩種瀏覽器既網頁且在800×600分辨率下查看。
1024－ie.html和1024－nc.html--分别代表1024×768分辨率下支持兩種瀏覽器的網頁。

 

瀏覽器問題

我地用網頁設計Dreamweaver既"Check Browser"功能。首先按F8打開Behaviors面板，單擊面板上的"＋"按鈕，在彈出的菜單中選擇"Check Browser"，彈出對話框。在Netscape Navigator後果個下拉框中選擇"Go to URL"，在Internet Explorer後的下拉框中選擇"Go to Alt URL"。然後分別單擊URL和Alt URL後的Browser按鈕選擇change－nc.html和change－ie.html。即係話，當網頁檢測到瀏覽器是Netscape 4.0以上版本時自動進入change－nc.html，若是Internet Explorer 4.0以上版本將自動進入change－ie.html。咁就實現左網頁根據不同瀏覽器進入不同頁面既功能。

在頁面上反映出相應的資訊。那就在< body>和< /body>之間加入以下代碼吧

< script language=″javascript″>
var nav=navigator.appName //瀏覽器的名稱
var ver=navigator.appVersion//瀏覽器的版本
document.write(″已檢測到您的瀏覽器:″);
document.write(″< font size=3 color=red>″); //設計瀏覽器名稱既字体大小及颜色
document.write(nav);
document.write(″< /font>″);
document.write(″< font size=3 color=blue>″); //設計瀏覽器版本號既字体大小及颜色
document.write(ver);
document.write(″< /font>″);
document.write(″正在進入頁面,請稍候…″);
< /script>

分辨率問題解決分辨率問題在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可以check到更多分辨率
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()″
< 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>
最後，< body>和< /body>之間加入以下代碼顯示網頁既工作信息：
搞掂，試下啦喂！