ASP 入門教學– 準備篇
Download
Report
Transcript 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
Internet
(IE Netscape)
HTML
HTML
ASP
應用程式
資料庫
建立ASP單機互動平台
你需要安裝一個可以執行ASP的伺服軟體，這樣才可以在本機預覽
ASP執行結果。所以一定要安裝伺服軟體，就看看下表您需要怎麼
樣的伺服軟體：
作業系統
須安裝的
Server軟體
取得方式
Windows XP
IIS
新增/移除 裝置
Windows ME 98 95
PWS 4.0
Windows 98 光碟中
Add-ons\pws\setup.exe
Windows 2000
IIS 5.0
新增/移除 功能
測試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>
FACE
字型
<FACE=“標楷體“>
COLOR
顏色
<COLOR=“#FFFFFF”>
大小
<SIZE=3>
<SIZE=+1>
<SIZE=-2>
SIZE
文字
<B>粗體</B>
<I>斜體</I>
<U>底線</U>
空白文字  
圖像
<IMG>顯示圖像
SRC
<IMG SRC=“logo.gif” Border=1 Alt=“作者相
片”>
圖像來源(相同資料夾目錄) <SRC=“LOGO.GIF“>
圖像來源(不同資料夾目錄)
<SRC=“.Image/LOGO.
GIF“>
WIDTH
寬度
<WIDTH=50>
HEIGHT
高度
<HEIGT=100>
Border
外框
<Border=1>
Alt
圖像文字
<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>
<Name=“data”>
Name
名稱
Action
接收資料的asp程式 <Action=“asp\test.asp>
Method
指定資料傳送方式
<Method=“get”>
<Method=“post”>
<FORM NAME=“data” ACTION=“test.asp” METHOD=“get”>
</FORM>
表單輸入項
<INPUT>
TYPE
輸入資料類型
<TYPE=“text”>
VALUE
初始值
<VALUE=“結束”>
<INPUT TYPE=“button” NAME=“button-1” VALUE=“確定”>
TYPE
TEXT
文字輸入
BUTTON
按鈕
PASSWORD 密碼輸入
CHECKBOX
勾選清單(單選)
RADIO
勾選清單(單選)
FILE
可瀏覽檔案的文字輸入
SUBMIT
傳送按鈕
RESET
清除輸入資料按鈕
HIDDEN
隱藏
多行文字輸入
<TEXTAREA>
Name
名稱
<Name=“MEMO”>
COLS
寬幾字
<COLS=40>
ROWS
高幾行
<ROWS=6>
READONLY
唯讀
<READONLY>
<TEXTAREA COLS=7 ROWS=5>
………
</TEXTAREA>
顏色的數值
<BODY bgcolor=#5d4d8d> ■設定背景的顏色!!</font>
<font color=#9a6400> ■設定文字的顏色!!</font>
#ffffff這六個單位分別代表著 R G B 三原色光
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
引用檔案
被引用檔
案
index.htm
a.gif
myweb.htm
a.gif
index.htm
bird.mid
myweb.htm
bird.mid
相對路徑
相對路徑