表格的应用与框架、连结.pptVIP

Thank you 感謝您的聆聽 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 網頁設計與製作 第四單元：表格的應用與框架、連結 NordriDesign專業商務簡報設計 授課教師：王漢銘 認識表格 表格是在HTML網頁上呈現表格式資料以及展示文字和圖形的用途。 表格是由列與欄所構成。 每一列則由一個或多個儲存格構成。? 插入表格 「功能表\插入\表格」。 「插入面板\常用\表格」。 「插入面板\版面\表格」。 插入表格 列 欄 表格寬度 邊框粗細 儲存格內距 儲存格間距 頁首 插入表格 靠左對齊 靠上對齊 兩者皆有 註解 摘要 表格的屬性設定 選取表格，在屬性檢視窗可找到表格的屬性設定。 表格的屬性設定 表格ID 列和欄 寬 內距 間距 對齊 預設 表格的屬性設定 靠左對齊 置中對齊 靠右對齊:整格表格靠右邊來對齊，並有浮動的效果。 邊框 類別 清除欄寬度和清除列高度 將表格寬度轉換為像素和將表格高度轉換為像素 將表格寬度轉換為百分比和將表格高度轉換為百分比 儲存格的屬性設定 將游標停留在儲存格即可由進行儲存格的屬性設定。 儲存格的屬性設定 水平 垂直 寬和高 背景顏色 合併儲存格 分割儲存格 不換行 表頭 巢狀表格 就是一個表格位於另一表格的儲存格中，但是它的寬度會受到所在位置之儲存格的寬度所限制。 請同學看完示範操作後，再進行綀習 超鏈接 超連結可以讓我們在不同頁面或網站中進行轉換。 是構成網頁的重要關鍵元素。 建立超鏈接 直接輸入式 使用滑鼠反白選取一段想要加入連結的文字 在屬性檢視窗中連結欄位，輸入要連結的頁面路徑與名稱。 建立超鏈接 滑鼠指向 使用滑鼠反白選取一段想要加入連結的文字。 用滑鼠按住屬性檢視窗中連結欄位右邊的滑鼠指向。 拖拉滑鼠指向到檔案面板中的檔案上放開，就會把路徑跟檔名自動輸入到連結欄位。 建立超鏈接 選擇檔案 使用滑鼠反白選取一段想要加入連結的文字。 按住屬性檢視窗中連結欄位右邊的瀏覽檔案鈕。 點選您要連結的檔案後按確定，就會把路徑跟檔名自動輸入到連結欄位。 建立超鏈接 設定電子郵件鏈接 使用滑鼠反白選取文字。 在屬性檢視窗中連結欄位，輸入要連結的mailto:mail就完成了。 建立錨點 錨點加上超連結可讓我們隨意在頁面的任何一個位置移動。 將插入點移到要加入錨點的位置。 點選「常用面板/錨點」。 輸入錨點名稱，請使用英文名稱。 按下確認後錨點會在畫面中呈現一個船錨的圖案。 再利用超連結的方式來進行設定。 各種連結方式 網站內部連結 網站外部連結 其他連結方式 檔案下載連結 網站外部連結 超連結的其他設定 取消連結底線 超連結的文字格式 刪除超連結 請同學看完示範操作後，再進行綀習 框架 頁框是網頁的組合，頁框產生後包含兩個部份，二者合為一個頁框網頁。 畫面分割後的頁框（Frame） 所有頁框（Frame）的集合，我們稱之為頁框組（Frameset）。 由於網頁是由多個頁框與相對獨立的HTML網頁構成，必須將所有的HTML文件儲存在網站的根目錄，才能夠進行正確的連結。 框架 一組3個頁框所組成的網頁，包含頁框組在內的 4個對應的HTML文件。 頁框與頁框組有其特殊的屬性，需要使用頁框）與屬性的控制板分開設定。 目標 _blank _parent _self _top 請同學看完示範操作後，再進行綀習 參考資料 文淵閣工作室（2012）。Dreamweaver CS6網頁製作比你想的簡單。台北市：碁峯資訊。 施威銘研究室（2012）。正確學會Dreamweaver CS6的十六堂課。台北市：旗標。 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *