資料庫程式設計 – PHP+MySQL 第 三 章 HTML 語言        下一頁

 

第三章 HTML 語言

3-1 網頁前端設計與 HTML

內容:

在網頁系統的製作方面可區分為前端設計後端設計前端網頁設計係利用『瀏覽器』執行設計內容再顯示出來,設計網頁工具有 HTMLCSSJavaScriptJQuery、、等等語言。後端設計係由『網頁伺服器』執行其設計來製作 HTML 文件,最普遍使用工具是 PHP 程式。

本書並不打算詳細介紹製作前端網頁的製作方法,它是另外一門課程,如果再混擾於課程內,且會失去本課程的重心。但還是要透過網頁介面存取資料庫,因此,本書除了介紹一些常用的 HTML 語法,重點在『表單』與『表格』製作方面。即是透過『表單』來查詢資料庫系統,又系統回應查詢結果大多以『表格』方式,因此須利用 HTML 的『表格』製作方法,將其顯示於網頁上。本章僅介紹表格製作方法,至於表單於第 # 章介紹。

3-1-1 HTML 常用標籤

我們並不打算詳細介紹 HTML 標籤(太多了),僅介紹較常用或後面章節會用到的部分。

    

        

<! --- 注解 -->

注解

<html>…  </html>

Html 文件

<head>…   </head>

文件前頭

<title> … </title>

文件標頭

<body> … </body>

文件內容

<b> … </b>

粗體字

<u> … </u>

字體底線

<i> … /i>

斜體字

<font face=”標楷字”> …</font>

指定字體

<font size=+3> … </font>

放大(縮小)字體

<font color=”#FF0000”> … </font>

字體顏色

<ul type=”disc”> <li>… </li> </ul>

無序項目排列(含個別項目標籤)

<ol type=”1”> <li>… </li> </ol>

有序項目排列(含個別項目標籤)

<p> … </p>

文件內容分段

<center> … </center>

對落處理 置中

<div align=”center”> … </div>

區段段落處理 置中

<div align=”left”> … </div>

區段段落處理 靠左

<img src=”圖片來源”>

插入圖片

<a href=”連結位置”> 連結名稱 </a>

超連結(文字或圖片)

<table width=”” heigh=”” border=””>

   <tr>

      <td> … </td>

      <td> … </td>

   </tr>

   <tr> …. </tr>

表格宣告

插入第一列

插入第一個儲存格

插入第二個儲存格

結束第一列

插入第二列

3-1-2 HTML 簡介

超文字標籤語言(HyperText Markup Language, HTML)是描述靜態文件表示方法 ,而它並不是一個程式,只是插在文件中的標示碼( code ),這些碼可以控制我們的瀏覽器要怎樣把文件顯示出來,它可控制字體的大小,插入連結或圖像。為了讓文件多采多姿,我們設定許多標示碼來顯示不同的樣式,這些碼統稱為『標籤』(Markup)

一個HTML檔稱為HTML document,存檔的副檔名為htmhtml,編寫工具有很多種,最原始的方法是用windows內的記事本或各種文書編輯軟體,編寫完成後記得儲存成*.htm*.html 即可。

一份標準的HTML文件是由多個元素所組成的,每個元素由標籤(Tag)以及文件內容所組成。文件內容可以是文字、圖形、甚至是影像、聲音等等。一個開始標籤(< >)是由一個小於符號(<)和一個大於符號(>)所構成的一個起始標籤中加一道斜線"/"就構成了結束標籤(</>),而一對標籤是由一個起始標籤和一個結束標籤所構成的。

3-1-3 製作HTML 文件

製作 HTML 步驟如下:(文件如下)

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Ex3_1.html</title>

</head>

<body>

   文件內容寫在這裡 !!

   各種標誌符號 < … > 也寫在這裡

</body>

</html>

(1) 步驟 1利用記事本製作文件(Example_1.html)後儲存於 C://AppServ/WWW 目錄下。

 (2) 步驟 2選『另存新檔』、存儲於『C:\AppServ\www』目錄下,檔案名稱須用雙引號包起來,如『”Example.html”』,編碼必須選『UTF-8』。

 (3) 開啟瀏覽器,URL 位址輸入: http://localhost/Example_1.html

 (4) 如無法顯示或不滿足,則回到步驟 1 繼續修正。

翻轉工作室:粘添壽

course_db 關聯圖

 

資料庫程式設計:

 

 

 

翻轉電子書系列: