51CTO下載-HTML與PHP基礎(chǔ).ppt

1、HTML與PHP基礎(chǔ),靜態(tài)網(wǎng)頁 vs. 動態(tài)網(wǎng)頁,概 述,為了在世界范圍內(nèi)發(fā)布信息，需要一種能夠被普遍理解的語言，一種能為所有的計算機(jī)作為信息發(fā)布用的母語，這就是萬維網(wǎng)使用的超文本標(biāo)記語言（Hypertext Markup Language，HTML)。,HTML句法結(jié)構(gòu),HTML句法結(jié)構(gòu),Google首頁的部分源代碼 Google . 另外還有HTML文檔主體部分的聲明。 ,HTML句法結(jié)構(gòu),一個HTML文檔是普通的ASCII文本文件，它包含兩類內(nèi)容：普通的文本、代碼或標(biāo)記。 標(biāo)記(Tag)是用一對尖括號“”括起來的文本串，例如第一行的。標(biāo)記通常具有如下結(jié)構(gòu)： 在標(biāo)記定義中，“tagname

2、”是標(biāo)記名，定義標(biāo)記的類型；而“attributes”為屬性，一般標(biāo)記即可以不定義屬性，也可以定義若干個屬性 屬性給出了這個元素的附加信息。,HTML句法結(jié)構(gòu),在Google主頁文檔第二行的標(biāo)記中，head是標(biāo)記名，沒有相關(guān)屬性。 在文檔主體定義中，定義了若干屬性，屬性值為“bgcolor=#ffffff text=#000000 link=#0000cc vlink=551a8b alink=#ff0000 onLoad=sf()”。,HTML句法結(jié)構(gòu),需要注意，雖然標(biāo)記和屬性名稱與字母大小寫無關(guān)，但是屬性值卻往往對大小寫敏感。 例如，可以在超鏈中定義相關(guān)的文件名，盡管在Windows系統(tǒng)中

3、，href=a1和href=A1可以指向同一文件，但在UNIX系統(tǒng)中，卻是指向不同的文件。 重要提示：在網(wǎng)頁設(shè)計須統(tǒng)一命名方案,HTML句法結(jié)構(gòu),標(biāo)記和文本結(jié)合起來形成元素(Element)。每個元素代表文檔中的一個對象，比如文件頭、段落或圖片。一個元素可具有一個或一對標(biāo)記，通常具有一些相關(guān)的屬性。 元素有兩種類型：容器（container）元素和單個元素（空元素）。,HTML句法結(jié)構(gòu),容器元素包含文本內(nèi)容，代表一個文本段、它由文本主體（或其他元素）組成，文本主體在開頭和結(jié)尾處用一對標(biāo)記來確定邊界（結(jié)尾的標(biāo)記用標(biāo)記名前加“/”來表示，并不帶任何屬性）。 例如，和標(biāo)記把這兩個標(biāo)記之間的文本定義成

4、一個文檔標(biāo)題。 而單個元素是由不影響任何文本的單個標(biāo)記組成的，它會在文檔中插入一些對象。例如標(biāo)記就是一個可以在文檔中插入圖像的單個元素。,HTML文檔結(jié)構(gòu)和常用元素,這三個元素一起構(gòu)成完整的HTML文檔結(jié)構(gòu)模板，所有的HTML文檔都應(yīng)該遵循這個模板： Header element body of Document ,HTML文檔結(jié)構(gòu)和常用元素,容器元素中包含的最為常用的元素有： text：這個元素是文檔的抬頭，類似書籍的頁眉。在瀏覽器中，標(biāo)題通常與文本頁分開顯示（例如，在窗口的標(biāo)題欄中）。 抬頭（TITLE）在用戶保存網(wǎng)頁時一般都作為文件名，所以命名應(yīng)該注意。,HTML文檔結(jié)構(gòu)和常用元素,容器

5、元素中包含以下幾個常用元素： text：標(biāo)題把括起來的文本作為標(biāo)題。從標(biāo)記、直到，可以有六個層次的標(biāo)題（較小的數(shù)字標(biāo)記較重要的標(biāo)題）。標(biāo)題通常用較大的字型編排，并且在該標(biāo)題的上下各有一個空行。 ：段落標(biāo)識文本主體中兩個段落之間的間隔。 ：圖像標(biāo)記把圖像插入到文檔中，圖像可以在SRC屬性中給出的URL處找到。,HTML文檔結(jié)構(gòu)和常用元素, 把圖像插入到文檔中，圖像可以在src屬性指定的URL處找到。最常見的圖像格式是GIF。 如果瀏覽器不支持插入圖像（例如，Lynx瀏覽器），將顯示在可選的alt屬性中給出的文本。如果沒有給出alt屬性值，在圖形所在的位置上可能會出現(xiàn)IMAGE的字樣。 可選的al

6、ign屬性指出文本的當(dāng)前行與圖像在垂直方向上怎樣對齊（通常是BOTTOM，但這隨瀏覽器的不同而不同）。,HTML文檔結(jié)構(gòu)和常用元素,ISMAP屬性用于建交互式的圖形。如果使用語法，則這圖像上成為一個可擊點，產(chǎn)生一個鏈接到URL1處。 例如： ,texttext：該結(jié)構(gòu)提供了一個無序的條目列表；每個條目以標(biāo)記開始。通常在顯示出的各條目項前置一個實心的圓點。 text：超文本標(biāo)記，也稱為超鏈接。文本用某種特殊方式來顯示（用顏色、下劃線或其它類似方法）；當(dāng)點擊屏幕上的超文本鏈接時，Web服務(wù)器將檢索“HREF” 屬性中的“URL”給出的文檔，并將結(jié)果返回給用戶瀏覽器。 ：放置一個橫穿瀏覽器窗口的水平

7、線，通常水平線的上下各有一個空行。 ：在文本中強(qiáng)制換行，以便后繼文本都放在下一行。,HTML文檔結(jié)構(gòu)和常用元素,HTML標(biāo)準(zhǔn)單位,長度單位 可以用來定義水平線、表格邊框、圖像等對象的長、寬、高等一系列屬性，同時也能用來定義這些對象在網(wǎng)頁上的位置等屬性。 長度的表示有兩種方式：絕對長度和相對長度。 它們的單位分別為像素（pixel）和百分比（），像素代表屏幕上的各個顯像點，而相對長度則描述了對象在瀏覽器窗口的所占的比例。,HTML標(biāo)準(zhǔn)單位,一般在網(wǎng)頁設(shè)計中較少使用絕對長度，因為瀏覽器窗口可隨時調(diào)整大小，如果水平線設(shè)置為絕對長度很容易造成不協(xié)調(diào)，而使用相對長度來描述則對象會隨瀏覽器窗口大小變化而變

8、化。 ,HTML標(biāo)準(zhǔn)單位,顏色單位也是描述網(wǎng)頁表現(xiàn)形式中應(yīng)用很頻繁的一種數(shù)據(jù)類型。在設(shè)計網(wǎng)頁的過程中，需要能定義字體、頁面背景、表格背景甚至超鏈接的顏色，通過利用顏色數(shù)據(jù)來定義這些對象的顏色屬性。,HTML標(biāo)準(zhǔn)單位,顏色單位有三種表達(dá)的方式： 十六進(jìn)制的顏色代碼 Red Characters 十進(jìn)制顏色碼 Blue 顏色名碼 Green Characters ,HTML標(biāo)準(zhǔn)單位,統(tǒng)一資源定位器(URL)1路徑是一種因特網(wǎng)資源地址的表示法。該數(shù)據(jù)里中可以包括鏈接所需協(xié)議、鏈接主機(jī)的域名或IP地址、鏈接主機(jī)的通訊端口（port）號、主機(jī)文件的發(fā)布路徑和文件名稱等。 1 由W3C對HTML 4.0的

9、定義中，URL的描述為“Universal Resource Identifier（URI）”。,HTML標(biāo)準(zhǔn)單位,在HTML中，URL路徑又分為兩種形式：絕對路徑和相對路徑。 絕對路徑是將主機(jī)地址和主機(jī)上資源發(fā)布目錄的路徑和資源名稱進(jìn)行完整的描述。如: ,HTML標(biāo)準(zhǔn)單位,相對路徑則是相對于當(dāng)前的網(wǎng)頁所在目錄或站點根目錄的路徑。如: ,HTML基本元素的使用,表單（form） HTML的表單特性是給予萬維網(wǎng)真正力量、完成生動的交互式應(yīng)用的因素之一。 HTML表單僅僅是這種特性的一半。一旦用戶填完表單，就把表格提交給一個特殊的程序或腳本，由這個程序或腳本取出信息，并用這個表格做一些有用的事（如

10、把用戶數(shù)據(jù)傳遞給數(shù)據(jù)庫）。 可以把表單看成因特網(wǎng)上通用的一種視窗（window）對話框，用于接受用戶數(shù)據(jù)。,表單(續(xù)),表單元素 form body 元素括起整個表單，并給出一些基本定義。表單僅占用HTML文檔的部分空間；實際上，一個HTML文檔可以包含幾個獨立的、完成不同功能的表單。method指定了信息傳遞給HTTP服務(wù)器的方法；action給出與處理提交信息的腳本相關(guān)的URL（如“scriptname.asp”，“scriptname.php”）。,表單(續(xù)),表單輸入元素 用來把不同的字段放在表單里，以便用戶輸入信息。 name屬性指定該字段在某個表單中的唯一名稱； 可選的value屬

11、性給出該標(biāo)記的默認(rèn)值。 在提交表單時，向Web服務(wù)器呈上以一組用“？”開頭并用“ PHP網(wǎng)頁的程序參數(shù)（或變量）至少可以從URL地址欄輸入；網(wǎng)頁的輸出可以隨程序參數(shù)（或變量）值變化而變化。 在本例在/greeting.php網(wǎng)址之后附帶了“?name=Cheng” 。 等號“=” 左邊為“參數(shù)”， “=”右側(cè)為參數(shù)值 當(dāng)需要輸入的參數(shù)多于一項時，參數(shù)之間要用“&”號隔開,HTML表單與PHP處理程序,在瀏覽器的URL地址欄輸入網(wǎng)頁的名稱和相關(guān)參數(shù)，而這種用戶數(shù)據(jù)的輸入方式顯然是很不方便的。尤其不適合普通瀏覽器用戶的使用。 在HTML中，一般瀏覽器用戶是通過表單完成

12、網(wǎng)上的數(shù)據(jù)輸入的。,HTML表單與PHP處理程序,HTML表單與PHP處理程序,HTML表單與PHP處理程序,一個簡單的HTML表單 姓名: 興趣: ,HTML表單與PHP處理程序,對簡單表單的PHP程序處理 Welcome! ! ,HTML表單與PHP處理程序,注意： 含有表單的文件往往是一個“純”HTML文件，比如上例的表單文檔就是一個有“.htm”后綴的文件。 HTML表單是一個容器元素，即有開始和結(jié)束標(biāo)記，在中至少包含兩個屬性：“ACTION”和“METHOD”。,HTML表單的ACTION, ACTION屬性的值表示該表單的處理方法，也就是表單提交后需要執(zhí)行的CGI程序名(包括路徑)

13、 由于本課程的CGI程序用PHP編寫，因此，一般ACTION屬性中填寫的就是對應(yīng)的PHP程序或動態(tài)網(wǎng)頁的名稱。 表示在用戶提交表單后，由Web服務(wù)器上的echo.php程序來處理用戶所提交的數(shù)據(jù)(該文檔與form.htm在同一目錄中)。,HTML表單的METHOD, METHOD說明本表單向服務(wù)器發(fā)送輸入信息時的使用方式 一般有兩種選擇：POST和GET，默認(rèn)的方式是GET。,HTML表單的METHOD,使用GET時，HTTP的客戶端將表單上用戶的輸入信息作為字符串附加在ACTION所設(shè)定的URL后面，中間用“?”和“&”隔開，然后把整個字符串傳送到服務(wù)器端 PHP程序會用$QUERY_STR

14、ING內(nèi)置變量獲取表單所傳入的信息。 但由于系統(tǒng)內(nèi)置變量的長度限制了輸入字符串的長度，因此，用GET方式所能傳送的數(shù)據(jù)長度受到限制(一般為2k字節(jié)),HTML表單的METHOD,而使用POST方法時，HTTP會將表單的輸入信息進(jìn)行包裝后發(fā)送，而不是附加在Action所設(shè)定的URL之后發(fā)送，CGI程序中可以用$CONTENT_LENGTH內(nèi)置變量來確定傳入數(shù)據(jù)的長度，并通過標(biāo)準(zhǔn)輸入（stdin）將內(nèi)容讀出。 使用POST方法,用戶數(shù)據(jù)的長度沒有限制,PHP函數(shù),PHP函數(shù)庫是一種通過CGI接口執(zhí)行的網(wǎng)絡(luò)應(yīng)用指令集 CGI程序?qū)嶋H上與Shell程序類似，而PHP強(qiáng)大的功能很大一部分源于它豐富的函數(shù)庫 在PHP 4.0中，這些函數(shù)可以分為100余類，共計一千多個，而且還在不斷的擴(kuò)展之中 用戶可以把PHP函數(shù)看成動態(tài)網(wǎng)頁的重要構(gòu)件，只要使用得當(dāng)，使用函數(shù)進(jìn)行程序設(shè)計可以收到事半功倍的效果,PHP函數(shù),PHP函數(shù),常用PHP函數(shù)分類,普通程序設(shè)計語言共有的函數(shù) 數(shù)學(xué)/數(shù)組函數(shù) 字符串處理函數(shù) 時間日期函數(shù) 文件函數(shù) 數(shù)據(jù)庫專用函數(shù)（Informix ,MySQL, Oracle 8 , PostgreSQL，Unified ODBC ） 環(huán)境函數(shù)（PHP Options&Information， Session handling，COM support fun