:::

3. 表格、圖片與版型

一、正確觀念

  1. 版型不應該用Table來建立,而是應該用<div>這類的標籤來規劃版型。用表格會缺乏彈性,而且也不是新一代網站的正確作法,表格就應該拿來當作表格用。
  2. 但若您不想花太多時間在喬位置,或者網站內容充滿變數,亦或是沒有打算利用CSS來換版型者,那麼,表格會是一個簡單省時的作法。

二、表格標籤<table></table>

  1. 屬性:對齊 align(left,center,right)、背景色 bgcolor、邊框border、內邊距cellpadding、欄間距cellspacing、外框模式frame(void, above, below,hsides, lhs, rhs, vsides, box, border)、內框模式rules(none, groups,rows, cols, all)、表格摘要summary、寬度width
  2. frame不能在IE中正確顯示 、rules不能在IE,Chrome或Safari中正確顯示。

三、橫列標籤<tr></tr>

  1. 屬性:對齊 align(left, center, right, justify)、背景色 bgcolor、垂直對齊valign(top, middle, bottom, baseline)
  2. <tr></tr>中至少要有一組<th></th>或<td></td>

四、儲存格標題<th></th>、儲存格內容<td></td>

  1. 屬性:簡述abbr、對齊align(left, right, center, justify)、背景色 bgcolor、水平合併colspan 、高度 height、不斷行 nowrap、垂直合併rowspan、作用範圍scope(col, colgroup, row, rowgroup)、垂直對齊valign(top, middle, bottom,baseline)、寬度 width

五、表格標題<caption></caption>

  1. 屬性:對齊 align(left, right, top, bottom)

六、圖片<img src="圖片" alt="說明">

  1. 屬性:對齊 align(top, bottom, middle, left, right)、邊框 border、高度height、高度height、水平間距 hspace、垂直間距 vspace、寬度width
  2. 網頁圖片支援三種規格jpg(全彩、壓縮、相片)、png(全彩、透明)、gif(256色、透明背景、動畫)

七、相對路徑、絕對路徑

  1. 相對路徑(相對於自身html檔)較常用,絕對路徑通常為:http://網址/圖檔.jpg

八、HTML的顏色碼

  1. HTML顏色是用十六進位(00~FF)的紅、綠、藍(RGB)之組合而成的。 例如:#FF0000為紅色,#808080為灰色,#000000為黑色,#FFFFFF為白色
  2. 也可以直接寫顏色名,例如:red、gray、black、white等。

九、HTML長度單位

  1. 長度不用寫單位,一般預設就是px(像素)。例如 <table width="640">
  2. 也可以用百分比表示,例如:<table width="100%">

十、不錯的佈景網站

  1. http://www.mezzoblue.com/zengarden/alldesigns/
  2. http://www.cssdrive.com/
  3. http://www.freecsstemplates.org/
  4. http://www.templateworld.com/free_templates.html
  5. http://www.oswd.org
  6. http://www.oswt.co.uk/index.html

:::

搜尋

QR Code 區塊

https%3A%2F%2Fwww.tad0616.net%2Fmodules%2Ftad_book3%2Fpage.php%3Ftbsn%3D18%26tbdsn%3D408

書籍目錄

展開 | 闔起

線上使用者

1人線上 (1人在瀏覽線上書籍)

會員: 0

訪客: 1

更多…