3-2 HTML 結構
3-2-1 HTML 文件結構
圖 3-1 HTML 文件格式 圖 3-1是HTML 文件的基本格式,說明如下: (1) <html xmls=”http://www.w3.org/199/xtm”> </html>:標示此範圍內是 HTML 文件,其中 xmls 參數是指定文件格式的版本。 (2) <head> …</head>:網頁的前頭。這區域裡面指定本文件的相關參數。 (3) <meta … />:網頁前頭內指定本文件的規範內容。 (4) <title> … </title>:網頁標頭。此區段文字會出現在瀏覽器網頁的標頭上。 (5) <body> … </body>:網頁內容。欲顯示在網頁內的文字、格式、、等等,都在這區塊內編寫。 3-2-2 程式範例:展示唐詩 (A) 網頁功能: Ex3_1.html 吾人需要製作一只展示唐詩『遊子吟』的網頁,期望期格式如下:
(B) 製作技巧: 依照題目需求,我們需要將遊子吟詩句張貼於網頁的中央,無論網頁大小如何改變,他都會在中央,因此,我們必須利用 <center>與</center> 標示語句放在該詩句的前後。 (C) 程式範例:(利用記事本輸入,並儲存為 “Ex3_1.html”)
(D) 程式說明: (1) <center> … </center>:區段內文字放置於網頁的中央。 (2) <BR>:換行。 3-2-3 程式範例:製作公告文件 (A) 網頁功能: Ex3_2.html 吾人需要將一份公告在網頁上顯示,請您幫他製作出來,內容與格式如下:
(B) 製作技巧: 這份文件乍看起來,要用 HTML 來編寫好像很困難的樣子,但又利用 Word 來製作就非常簡單,之間差異在哪裡?原因是我們用 Word 製作時,Word 系統會自動幫我們插入標示符號,但用 HTML 製作時,必須自行輸入這些符號,就會感覺很複雜。其實,也有 HTML 文件製作工具會自動幫我們插入這些標示符號,這就是 Frontpage 或 Dreamweaver 等工具。但我們要利用 HTML 來編寫網頁資料庫程式,所以還是需要認識一些它的特性。我們可以將上述文件特性歸納下來,比較好設計,如下: (1) 所有字體皆是『標楷題』(face=”標楷體”)。 (2) 第一行字體較大,大約是 8 號字(size=”8”)。 (3) 第 2~7 行以不同顏色顯示(color=”red”、”blue”、”black”..)。 (4) 每改變一次文字參數需用 <font> …</font> 區塊包起來。 (5) 字體顏色可參考:http://www.w3schools.com/tags/ref_colornames.asp網站,或用 google 查詢。 (B) 程式說明: (1) <font face=”標楷體” …> … </font>:該區域內文字顯是參數。 (2) <p> </p>:文字段落,會強迫換行,相當於 <BR> 的功能。 (3) <font ..><font ..> ….</font></font>:字體設定參數內,可以再重新設定,成為巢狀的設定。 (A) 程式範例:(利用記事本輸入,並儲存為 “Ex3_2.html”)
(B) 程式說明: (1) <font face=”標楷體” …> … </font>:該區域內文字顯是參數。 (2) <p> </p>:文字段落,會強迫換行,相當於 <BR> 的功能。 (3) <font ..><font ..> ….</font></font>:字體設定參數內,可以再重新設定,成為巢狀的設定。 |
翻轉工作室:粘添壽
資料庫程式設計:
翻轉電子書系列:
|