Tad 教材網 - 線上書籍

:::

\[1001\]XOOPS網站門面專業設計
=====================

[![](http://tad0616.net/uploads/dl.gif)](http://www.tad0616.net/uploads/tad_book3/file/1001/04.pdf)

### 一、 連結標籤<a href="連結位置">顯示文字</a>

1. 連結位置可以是網頁、圖片、網站、文件、檔案、FTP站、Email...等。
2. 屬性：連結位置href、錨點名稱name、框架位置target（\_blank開新視窗, \_parent上個框架, \_self原視窗, \_top跳出框架）。
 
### 二、 錨點名稱用法

1. 先命名：<a name="top">某元素</a>
2. 連結寫法：<a href="#top">回頂端</a>或<a href="index.html#top">回頂端</a>
 
### 三、 Email連結

1. <a href="mailto:主信箱?cc=副本&bcc=密件副本&subject=主題&body=內容">連結呈現文字</a>
2. 例如：<a href="mailto:tad0616@gmail.com?cc=tad@tn.edu.tw&bcc=kai@gmail.com&subject=報名研習&body=參加者姓名：">研習報名</a>
3. 若非得加入空白不可，請用「%20」取代之。
 
### 四、 三種列表：

1. 有序列表：<ol><li>項目</li></ol> 
  - 屬性：起始編號start 、編號類型type（1, A, a, I, i ）
2. 無序列表：<ul><li>項目</li></ul> 
  - 屬性：項目類型type（disc, square, circle ）
3. 定義列表：<dl><dt>項目名稱</dt><dd>項目說明</dd></dl>
 
### 五、 用表格組圖

1. 用photoImpact來切圖→切割工具→Ctrl+Alt+S（儲存成HTML）→「選項」→影像檔選擇PNG→儲存即可。（接著去images把圖複製出來即可）
2. 固定基本款：一張圖，一個表格，固定大小。 
  - <table background="底圖" width=寬 height=高>
3. 上下延伸款：三張圖，三個儲存格，可上下縮放。
 <table border="0" cellpadding="1" cellspacing="1" width="100%"> <tbody> <tr> <td rowspan="3" width="174">![](http://www.tad0616.net/uploads/tad_book3/image/1001/upgrade049.png)</td> <td width="366"><td background="上底圖" width=寬 height=高></td></td> </tr> <tr> <td width="366"><td background="中底圖" valign="top"></td></td> </tr> <tr> <td width="366"><td background="下底圖" height=高></td></td> </tr> </tbody> </table>

5. 縮放自如款：九張圖，九個儲存隔，可上下左右縮放。
 <table border="0" cellpadding="1" cellspacing="1" width="100%"> <tbody> <tr> <td rowspan="3" width="167">![](http://www.tad0616.net/uploads/tad_book3/image/1001/upgrade050.png)</td> <td width="373"><td background="底圖1" width=寬 height=高></td>  
 <td background="底圖2"></td>  
 <td background="底圖3" width=寬 height=高></td></td> </tr> <tr> <td width="373"><td background="底圖4"></td>  
 <td background="底圖5" valign="top"></td>  
 <td background="底圖6"></td></td> </tr> <tr> <td width="373"><td background="底圖7" width=寬 height=高></td>  
 <td background="底圖8"></td>  
 <td background="底圖9" width=寬 height=高></td></td> </tr> </tbody> </table>

:::