220 likes | 417 Views
網頁製作 Q&A 問題集. 張裕幸 yhchang@cc.shu.edu.tw. 關於 ftp 上傳. 上傳的方式 1 : ftp://a91070001@192.192.154.184. 學號. 主機位址. 密碼和學號相同. 【 Note 】 數位媒體概論同學尚未開設個人帳號,先以 a9107 為共同帳號及密碼. 主機位址. 學號. 密碼. 關於 ftp 上傳. 上傳的方式 2 : ftp://a9107:a9107 @192.192.154.184. Windows98 系統 有登入的歡迎詞 —
E N D
網頁製作Q&A問題集 張裕幸 yhchang@cc.shu.edu.tw
關於ftp上傳 • 上傳的方式1: • ftp://a91070001@192.192.154.184 學號 主機位址 密碼和學號相同 【Note】數位媒體概論同學尚未開設個人帳號,先以a9107為共同帳號及密碼
主機位址 學號 密碼 關於ftp上傳 • 上傳的方式2: • ftp://a9107:a9107 @192.192.154.184 Windows98系統 有登入的歡迎詞— Login Authorization successfully!
主機位址 關於ftp上傳 • 上傳的方式3: • ftp://192.192.154.184
關於ftp上傳 • 檔案上傳 • 點選本機檔案後拖曳至伺服器資料夾中。 • 上傳成功? • 若ftp主機資料夾中顯示上傳檔案的圖示檔,表示上傳成功。 • 在Cuteftp軟體中會有傳輸成功的訊息。 • 192.192.154.184ftp 伺服器提供每位同學100MB上傳空間,各位同學應將檔案傳送至自己的資料夾中,並遵守資訊道德,不隨意刪除他人檔案。 • 為防止已上傳作業被刪除,同學應隨時備份檔案至個人家中電腦或USB隨身碟中。 拖曳
關於ftp上傳 • 檔案下載 • 登入ftp伺服器主機(192.192.154.184)後,點選所欲下載檔案,按右鍵選取「複製到資料夾」選項,再瀏覽資料夾並指定適當本機路徑後按「確定」後即可。 • Windows98系統僅能以上述方式下載檔案,Windows XP則可以拖曳方式進行下載檔案。
關於ftp上傳 • Cuteftp的上傳、下載: • 上傳動作-先點選左邊本機資料夾並選定欲上傳檔案後,按下工具列的Upload按鈕即可。 • 下載動作-與上傳動作相反,點選ftp主機上欲下載檔案,再調整左邊本機儲存路徑,按下工具列的Download按鈕即可。 • Cuteftp軟體本身是ShareWare,提供完整試用功能,使用者若覺得好用可以註冊購買正式版,試用版下載網址:http://www.softking.com.tw
關於ftp上傳 • 其他注意事項: • 上傳至ftp的檔案可以刪除、覆蓋及重新命名。 • 在ftp伺服器上的檔案,不能直接Click兩下開啓原始檔,必須下載至本機後再開啓其原始檔或執行。 • 上傳Flash原始檔時必須關閉FlashMX的程式及其原始檔,否則原始檔會被鎖位無法上傳。
http v.s ftp • http: hyper-text transfer protocol縮寫-超文字傳送協定,用以瀏覽網站(頁),本身是TCP/IP的一個協定。 • ftp: file transfer protocol縮寫-為檔案傳輸協定,用以進行遠端伺服器的檔案傳送,亦為TCP/IP的一個協定。 • ftp可以搭配專屬檔案傳輸的軟體,如Cuteftp、WS_FTP、Filezilla(http://www.sourceforge.net/project/filezilla)等軟體,簡化檔案傳輸操作動作。
游標底色設定 <html> <head> <!--- 設定游標底色 start---><style type="text/css"><!--a:hover { background-color: #FFCC66}--></style><!--- 設定游標底色 end---></head> <BODY> 16進位色票編號
Css內嵌樣式文字設定 <html> <head> <!---設定字型 start ---><STYLE type=text/css> .SSIZE { FONT-SIZE: 9pt; LINE-HEIGHT: 140%} .MSIZE { FONT-SIZE: 11pt} A { TEXT-DECORATION: none}</STYLE><!---定字型 end ---></head> <BODY> 這行設定可以消除超連結的底線 套用CSS樣式表的字型顯示
電子跑馬燈設定 以上捲方式呈現 <html> <head> </head> <BODY> <marquee id=announcement direction=“UP” behavior=“scroll” dataformatas=“HTML” width=“412” height=“16” scrolldelay=“200” scrollamount=“1” border=“1” onMouseOver=announcement.stop() onMouseOut=announcement.start() style=“color: #008000”><img src=images/abalbul2.gif align=left>資傳系張裕幸老師教學網頁92學年重新改版!<img src=images/abalbul2.gif align=left>NOTE:互動程式設計課程講義置放於教學講義項下!</marquee> 上述設定亦可以由FrontPage上,選擇功能列的「插入(I)」/「Web元件(W)」,在插入Web元件的視窗下選擇跑馬燈效果,即可以設定跑馬燈呈現方式(如右圖)。
透明註解視窗 • <html> • <head> • <!---浮動式說明視窗 Start----> • <style><!--.menuskin{position:absolute;width:110px;background-color:#e1f1ff;border:2px solid #99ccff;font:normal 9pt Verdana;line-height:18px;z-index:100;visibility: hidden;filter:Alpha(Opacity=75, FinishOpacity=80, Style=2);}.menuskin a{text-decoration:none; color:black;padding-left:10px;padding-right:10px;}#mouseoverstyle{background-color:#6392ef;}#mouseoverstyle a{color:white;}--></style><!---浮動式說明視窗 start----><script language="JavaScript1.2">var linkset=new Array()//設定子目錄,注意linkset[ ]中陣列數字需與主目錄的設定相同linkset[0]='<div class="menuitems">★影像處理課程</div>'linkset[0]+='<div class="menuitems">教學用練習圖檔。</div>'////以下勿動var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1var ns6=document.getElementById&&!document.allvar ns4=document.layers • . • . • . • </script><!---浮動式說明視窗 end----></head> • <BODY><div id="popmenu“ class="menuskin“ onMouseover="clearhidemenu();highlightmenu(event,'on')" onMouseout="highlightmenu(event,'off');dynamichide(event)" style="width: 110; height: 19"></div><a onMouseover="showmenu(event,linkset[0])" onMouseout="delayhidemenu()" href="im-figure-download.htm">PhotoImpact教學圖檔</a> 浮動視窗的顏色設定 透明度設定 註解的文字設定
內置框架 與index.html同目錄徑下的另一網頁 • 語法: <iframe name=A-window src=Class_Note.htm frameborder=0 width="360" height="655">A-window</iframe> 內置框架
ASP互動網頁(心理測驗) 網頁呈現畫面,網頁名稱:travel_test.htm 利用超連結語法內嵌於A-window的內置框架中 語法:<a href=travel_test.htm target=A-window>
邏輯結構 CGI前端程式 Asp後端程式
前端CGI設定 表單欄位內容 表單內容
後端ASP程式 <% Answer= Request("R1") If Answer = 1 Then Response.write "你選擇參加旅行團,分析結果:的確,參加旅行團比較方便…" End if If Answer = 2 Then Response.write "你選擇帶著寵物一起駕車出遊,分析結果:哇,你真是有愛心,…" End If If Answer = 3 Then Response.write "你選擇溫馨的家族旅行,分析結果:你計畫帶著全家人去旅行嗎?…" End If If Answer = 4 Then Response.write "你選擇「找朋友一塊兒熱鬧出發,製造回憶」,分析結果: 你會選擇和朋友結伴去旅行,…" End If If Answer = 5 Then Response.write "你選擇「和他一起享受浪漫之旅」,分析結果:要旅行當然是和他一起去嘍!…" End If If Answer = 6 Then Response.write "你選擇「一個人到沒去過的地方探險」,分析結果: 你會選擇自助旅行嗎?…" End If %>
ASP互動網頁(心理測驗) 引導式心理測驗
邏輯結構 CGI前端程式1 Asp後端程式 符合條件=No 符合條件=yes CGI前端程式2 CGI前端程式3
後端ASP程式 <% R0 = Request("R0") If R0 = "A" Then Response.Redirect "invest_image_4.htm" end if If R0 = "B" Then Response.Redirect "invest_image_1.htm" End If %> <HTML> <BODY> </BODY> </HTML> 程式執行導向前端程式4 程式執行導向前端程式1
設為首頁 • <a href=“#" onclick="this.style.behavior='url(#default#homepage)'; this.setHomePage('http://192.192.154.184/Web-3/index.html');">設為首頁</a> 按下設為首頁文字超連結