ASP 入門教學 – 準備篇

ASP 入門教學 –準備篇 紀蔚亮老師

教學大綱 Agenda • 準備 • 網頁計數器 Application 變數 • 設計輸入表單 • 資料庫與 ASP程式

準備 • ASP基本概念 • 建立ASP單機互動平台 • 安裝IIS (Win2000,XP) • 安裝PWS (Win98) • 常用HTML語言標籤(一) • Dreamweaver UltraDev基本操作

ASP 基本概念 • Active Server Page？ • ASP 的運作方式 • 測試你的第一個ASP 網頁 • 撰寫ASP 網頁的必備基礎

Active Server Page？ • ASP 其實就是Active Server Page[動態伺服器網頁]。 • 這套程式是由Microsoft微軟所開發出來的一種動態互動式網頁的一種格式。 • CGI、PHP是屬於同一性質，皆是在網路伺服器(Server) 執行的程式。 • 能夠產生動態、互動式的網站應用結果；如計數器、線上人數、資料庫、留言版、網路購物等…。 • 使用 ASP 就不用擔心客戶端的瀏覽器是否支援 ASP，因為 ASP 所送出的網頁是標準的 HTML 格式。

ASP 的運作方式 • 它是將我們所設計的網頁經由 Server 端翻譯後送出 HTML 文件給客戶端 Web Server 瀏覽器 (IE Netscape) Internet ASP HTML HTML 應用程式資料庫

建立ASP單機互動平台 • 你需要安裝一個可以執行ASP的伺服軟體，這樣才可以在本機預覽ASP執行結果。所以一定要安裝伺服軟體，就看看下表您需要怎麼樣的伺服軟體：

測試ASP伺服器應用程式 • 安裝完成後，重新啟動在IE網址欄中輸入 127.0.0.1或localhost ，即可看到下圖：

測試你的第一個ASP 網頁 • 建立網站於C:\Intpub\wwwroot\asp0XX資料夾中。 • 開啟新增檔案名為 test.asp • 於Dreamweaver UltraDev中輸入如下程式。今天日期為: <% = date()%> <P> 現在時間為: <% = time()%>

撰寫ASP 網頁的必備基礎 • 瞭解 HTML • 基本 Basic 程式語言 • Dreamweaver 的運用 • ASP 網頁由 HTML 及 Basic (VB Script) 來撰寫主要程式 ,而使用 Dreadmweaver UltraDev 4 工作介面來完成。

HTML • 基本概念 • 基本運用 • HTML語言一覽

基本概念 • 標籤式語言概念 • 區塊概念 • 標籤的屬性概念 • 階層概念 • 其他概念

標籤式語言概念 • 所有 .htm 檔案都是由標籤式語言為主要組成 <!-- html 基本架構 -- > <html> <head> <title>標題</title> </head> <body> 內容… </body> </html> • 如圖 < 及 > 符號之間所表示字串稱之標籤(Tag)

區塊概念 • 使 HTML 具有結構性 <!-- html 基本架構 -- > <html> <head> <title>標題</title> </head> <body> 內容… </body> </html>

屬性概念 • 大部份的HTML語言包含有許多屬性如 : <body bgcolor=“#ffffff” leftmargin=100> 標籤屬性屬性

階層概念 • 標籤式語言概念 <!-- html 基本架構 -- > <html> <head> <title>標題</title> </head> <body> 內容… </body> </html>

其他概念 • 多個空白字元,只會視為一個 • 按下Enter不會跳行 • 標籤語言不分大小寫 • 屬性值中若只有中英文字或數字,則不加“”亦可;但全加“”一定不會錯

HTML 基本運用 • 網頁基本架構 • 段落 • 文字 • 清單 • 圖像 • 超連結 • 表格 • 背景音樂

網頁基本架構 <!-- HTML 語言基本架構 -- > <html> <head> <title>標題</title> </head> <body> 網頁內容… </body> </html>

段落 • <P>段落標籤</P> • <BR>分行標籤 • <HR>水平線標籤

文字 • <FONT>文字標籤</FONT>

文字 • <B>粗體</B> • <I>斜體</I> • <U>底線</U> • 空白文字 &nbsp

圖像 • <IMG>顯示圖像 <IMG SRC=“logo.gif” Border=1 Alt=“作者相片”>

超連結 <A>…</A> • 文字超連結 <A HREF=“URL”> 連結文字</A> • 圖片超連結 <A HREF=“URL”><IMG SRC=“logo.gif”</A> • E-mail 連結 <A HREF=“mailto:電子郵件位址”> …… </A>

超連結的路徑 • <a href=“001.htm”>這是連結檔案在同一目錄下的標示法 • <a href="http://www.world.com">這是連結至網路上其它網站的標示法 • <a href="test/101.htm">下一個子目錄內檔案的連結 • <a href=“../index.htm”>連結到上一層目錄內的檔案 • 在 SERVER 上您的檔案路徑, 並非像家裏的電腦一樣,可以下指令 C:\ABC\INDEX.HTM , 但在網路上不行，必需用 ../退到上一層目錄。

表格 • 表格起始標籤 <TABLE> </TABLE> • 表格列標籤 <TR> </TR> • 儲存格標籤 <TD> </TD>

表單 • <FROM> </FROM> <FORM NAME=“data” ACTION=“test.asp” METHOD=“get”> </FORM>

表單輸入項 • <INPUT> <INPUT TYPE=“button” NAME=“button-1” VALUE=“確定”>

TYPE

多行文字輸入 • <TEXTAREA> <TEXTAREA COLS=7 ROWS=5> ……… </TEXTAREA>

顏色的數值 • <BODY bgcolor=#5d4d8d> ■設定背景的顏色!!</font><font color=#9a6400> ■設定文字的顏色!!</font> • #ffffff這六個單位分別代表著RGB三原色光 • 00 - FF(16進位) 相當於 000 - 255(10進位) ,從黑色到白色 • 使用小算盤將 255(10進位)轉換成 FF(16進位) !!

相對路徑與絕對路徑的觀念 / --interpub ---- index.htm ﹂ images – a.gif • 相對路徑 • 引用網頁存放檔案位置為參考基礎。 • 不同網頁引用同一個檔案時，其使用路徑都不相同。 • 在index 中引用a.gif時，相對路徑如下 ./images/a.gif • 絕對路徑 • 以根目錄為參考基礎。 • 不同網頁引用同一個檔案時，其使用路徑都一樣。 • 在index中引用a.gif 時，絕對路徑如下: /inetrpub/images/a.gif 『 . 』…….代表目前所在資料夾。『 .. 』……代表上一層資料夾。

/ ---- web1 ---- html -------- index.htm images ---- a.gif web2 ---- html ---- myweb.htm midi ---- bird.mid 範例

ASP 入門教學 – 準備篇

ASP 入門教學 – 準備篇

Presentation Transcript