網頁設計入門 與 Dreamweaver 使用簡介 講師：梁家豪 E-Mail: u8855043@ccu.edu.tw
圖片(Images) 目前網路上常見的圖片可以分為兩種 首先，至站台管理員，新增一個目錄，叫Images，方便未來管理圖片。 GIF：非失真壓縮，256色，用於小圖示 JPGE：失真壓縮，全彩，用於風景圖示 首先，至站台管理員，新增一個目錄，叫Images，方便未來管理圖片。 按下Site/Site Files 叫出站台管理員 在要新增目錄處點右鍵，選New Folder 再填入Images即可
插入圖示 按下Object功能表上的【Insert Image】 選擇檔案存放的位置 選擇完檔案後，會跳出一個對話視窗，此時按下是 此對話視窗是詢問是否要將圖片拷備一份進入自己的Site 再選擇剛才設定的Images目錄，將圖片存入
圖片注意事項 插入圖片，檔案最好 已經存過檔了，若否 ，則會出現左圖，代 表DW將先以絕對路 徑的方式存放圖片 檔案的命名，建議以英文為主 圖片應拷備一份至Site之中，以方便管理
圖片細部設定 點選圖片後，Properties會顯示出圖片的細部設定 WH，代表圖片的長寬 Src，代表圖片的來源 Align，代表圖片對齊方式 Alt，代表圖片的替代文字 Border，代表圖片的邊框寬度 Low Src，代表低解析度圖片來源
Rollover Image 按下Object功能表上的【Insert Rollover Image】 選擇Original Image，此圖代表一般顯示的圖片，選擇圖片與插入圖片的過程相同，都要拷備一份至Site 選擇Rollover Image，此圖代表當滑鼠移上去後，變換為何圖 再按下確定，使用瀏覽器預覽即可
路徑觀念 相對路徑 連結或圖片來源，是以相對於自己的Site來表示，所以會出現“../目錄/檔名”或“目錄/檔名”，一般而言，網頁製作已此為準 絕對路徑 指連結或圖片來源，在網路上的位置是絕對的，不因為處在地點不同而改變，通常會以http://開頭
設定超連結 第一步，先選取欲設定的文字 第二步，按下Properties上Link旁的資料匣圖示 第三步，選擇欲連結的檔案 如此，即完成連結
圖片連結與影像地圖 圖片連結與文字連結大同小異，第一步，先選擇欲連結的圖片 第二步，按下Properties上Link旁的小圖示選擇，欲連結的檔案 影像地圖方式也是相近的，步驟三，先選擇圖片 步驟四，於Properties上選擇適合的圈選工具 步驟五，同其他連結設定方式，選擇檔案
插入電子郵件連結 步驟一，按下Object功能表上的【Insert Email Link】 步驟二，Text是填入要顯示在螢幕上的字串，E-Mail則填入欲寄發信件的信箱 圖片設定上與連結相似，步驟三，先選取欲設定的圖片 步驟四，在Properties 上的Link處填入，【mailto:帳號】，即可
插入錨(Anchor) 第一步，先於插入錨處，點一下 第二步，選【Insert/Invisible Tags/Named Anchor】 第三步，輸入錨的名稱 第四步，圈選欲設定連結之字串 第五步，於Properties上之link設定【#錨的名稱】 同理，如是跨檔案的連結，則設定【檔名#錨的名稱】，如【page01.htm#r1】
表格結構 表格(Table)，指整個表格本身 儲存格(Cell)，指表格中的每一個小格子 橫列(Row)，指水平方向的儲存格 直欄(Col)，指垂直方向的儲存格
插入表格與格式化表格 步驟一，按下Object上的【Insert Table】 步驟二，選擇要多少欄位與邊寬 按下確定，即完成插入表格 格式化表格是套用現成的樣式來美化表格 步驟三，選擇【Commands/Format Table】 步驟四，選擇適合的表格樣式
表格細部解說 選定表格 WH，代表其寬與高之設定 CellPadding，代表儲存格內容與邊框距離 CellSpacing，代表儲存格與儲存格之間距離 Align，代表對齊方式 Border，代表表格之邊框線條粗細程度 Bg Color / Bg Image，代表表格之背景 Brdr Color，代表表格邊框之顏色
儲存格之細部解說 選定儲存格(選擇一個時，只需於其中點一下即可，若兩個以上，則以拖拉方式選取) Horz，代表水平對齊方式 Vert，代表垂直對齊方式 WH，代表其寬與高 No Warp，代表超過寬度不換行 Bg，代表其背景顏色與圖片 Brdr，代表其邊框顏色
Cell Padding 與Cell Spacing 解說 表格細部設定 存儲格細部設定
增刪儲存格 一般而言，如欲在表格最後面增加新的一列，只需要按下【Tab】鍵即可 一般而言，刪除一欄或一列儲存格，只需將其選取，再按下【Delete】鍵即可 進階的增刪，可於欲刪除或新增處，按下【Modify/Table】，選擇適合的指令 Insert Row，於目前位置之上插入一列 Insert Column，於目前位置之前插入一欄 Insert Rows or Columns，指一次插入多個欄或列，也可以定於之後，或之後插入
Modify/Table 插入多列的情況 插入多欄的情況
合併與分割儲存格 步驟一，選擇欲合併的存儲格 步驟二，按下Properties的Marge Cell 如此即完成合併儲存格 分割儲存格方法相似，步驟三，選擇欲分割的儲存格 步驟四，按下Properties的Splits Cell 步驟五，選擇欲分割成幾欄與幾列即可