育將電腦工作室 - 線上書籍

網頁設計好好玩
=======

一、網站區塊

1. 行內元素(inline) 
 和其他元素都在一行上； 
 高，行高及頂和底邊距不可改變； 
 寬度就是它的文字或圖片的寬度，不可改變。 
 a - 錨點abbr - 縮寫 
 acronym - 首字 
 b - 粗體(不推薦) 
 bdo - bidi override 
 big - 大字體 
 br - 換行 
 cite - 引用 
 code - 計算機代碼(在引用源碼的時候需要) 
 dfn - 定義字段 
 em - 強調 
 font - 字體設定(不推薦) 
 i - 斜體 
 img - 圖片 
 input - 輸入框 
 kbd - 定義鍵盤文本 
 label - 表格標簽 
 q - 短引用 
 s - 中劃線(不推薦) 
 samp - 定義范例計算機代碼 
 select - 項目選擇 
 small - 小字體文本 
 span - 常用內聯容器，定義文本內區塊 
 strike - 中劃線 
 strong - 粗體強調 
 sub - 下標 
 sup - 上標 
 textarea - 多行文本輸入框 
 tt - 電傳文本 
 u - 下劃線 
 var - 定義變量
2. 區塊元素(block) 
 總是在新行上開始； 
 高度，行高以及頂和底邊距都可控制； 
 寬度預設是它的容器的100%，除非設定一個寬度。 
 address - 地址 
 blockquote - 塊引用 
 center - 舉中對齊塊 
 dir - 目錄列表 
 div - 常用塊級輕易，也是css layout的主要標簽 
 dl - 定義列表 
 fieldset - form控制組 
 form - 交互表單 
 h1 - 大標題 
 h2 - 副標題 
 h3 - 3級標題 
 h4 - 4級標題 
 h5 - 5級標題 
 h6 - 6級標題 
 hr - 水平分隔線 
 isindex - input prompt 
 menu - 菜單列表 
 noframes - frames可選內容，（對于不支持frame的瀏覽器顯示此區塊內容 
 noscript - 可選腳本內容（對于不支持script的瀏覽器顯示此內容） 
 ol - 排序表單 
 p - 段落 
 pre - 格式化文本 
 table - 表格 
 ul - 非排序列表
 
二、插入圖片

1. <img src="要插入的圖片 URL" alt="圖片替代文字" title="要顯示的文字" border="圖片邊框">
2. **HTML img 圖片參數** <table cellspacing="1" width="720px"> <tbody> <tr> <td bgcolor="#eeeeee" width="130">**參數**</td> <td bgcolor="#eeeeee">**用法說明**</td> </tr> <tr> <td bgcolor="#eeeeee">src</td> <td>圖片網址，必要項目。</td> </tr> <tr> <td bgcolor="#eeeeee">border</td> <td>圖片邊框，例如 border="0" 代表邊框為 0。</td> </tr> <tr> <td bgcolor="#eeeeee">alt</td> <td>圖片替代文字，當圖片顯示失效，則顯示 alt 文字。</td> </tr> <tr> <td bgcolor="#eeeeee">title</td> <td>圖片文字標示，當滑鼠移經圖片，自動顯示的文字。</td> </tr> <tr> <td bgcolor="#eeeeee">width</td> <td>圖片寬度，例如 width="120px" 代表寬度限制在 120px。</td> </tr> <tr> <td bgcolor="#eeeeee">height</td> <td>圖片高度，例如 height="100px" 代表高度限制在 100px。</td> </tr> </tbody> </table>
3. 大圖下載：<https://unsplash.com/>

Title1

Title2

Title3

Title1

Title2

Title3

MarkDown