1、知識回顧：,1 網頁文檔的格式化 2 超級鏈接的應用 超級鏈接的分類與鏈接方法,層與表格的轉換,框架和框架集的使用,交互式表單的處理,預備知識,網頁制作基本操作的知識,本章學習目標： 表格的創(chuàng)建與編輯 層的創(chuàng)建、管理與使用 表格和層的轉換,表格的創(chuàng)建與編輯,層的基本操作,第3章 表格和層,第一節(jié) 表格的創(chuàng)建和編輯的方法 1 創(chuàng)建表格的基本操作 2 表格的編輯 3 表格的“布局”模式,1 創(chuàng)建表格的基本操作,1）新建表格 使用菜單【插入】|【表格】命令 工具欄上的表格按鈕 快捷鍵Ctrl+Alt+T 插入“表格”對話框，見下圖,2）、表格的構成,3）設置表格的屬性及行列屬性 表格的屬性 “填充”

2、：設置單元格的內容和單元格邊框之間空白處的寬度。 “間距”：設置各單元格之間的寬度。 “邊框”：設置表格外框線的寬度。,單元格的屬性：突出顯示某一部分數據的重要性 “不換行”：設置文本是否自動換行 “標題”：是否將單元格設置為表格的標題,1） 表格行、列的增加和刪除 調整表格屬性面板中的“行”、“列”值，增刪對象是表格的最底行和最右列。 通過菜單 【修改】|【表格】|【插入行】 【修改】|【表格】|【插入列】 【修改】|【表格】|【刪除行】 【修改】|【表格】|【刪除列】 見右圖,2 表格的編輯,2）單元格的合并與拆分,合并單元格操作只能針對連續(xù)的單元格使用。,表格中每一行中的單元格列數可能不

3、等，這時就可根據需要使用拆分命令把一個單元格變?yōu)閹讉€單元格。,3）表格的樣式化,菜單【命令】|【格式化表格】,4）表格的嵌套,指在一個表格的單元格中再插入一個表格，嵌套表格的寬度受所在單元格的寬度限制，其編輯方法與表格相同。,將表格插入到文檔后即可向表格添加文本或圖像等內容。向表格添加內容的方法很簡單，只需將插入點定位到要輸入內容的單元格中，再輸入文本或插入圖像即可。,5）編輯表格內容,6）從其他文檔導入表格式數據 將在另一個應用程序（如Excel）中創(chuàng)建的數據導入到網頁中并設置為表格的格式。首先使用應用程序的“導出”或“另存為”命令，把表格式數據保存為帶分隔符號（如制表符、逗號、冒號、分號或

4、其他分隔符）的數據。,3 表格的“布局”模式,兩種視圖模式：“標準”視圖和“布局”視圖 “布局”視圖中的表格稱為布局表格，單元格稱為布局單元格，雖然名稱有些變化，但它們的本質還是表格和單元格。在“布局”模式中插入表格的方法將變得更加靈活、更加直觀，就象畫圖一樣，你想在什么位置插入表格，就在該位置用鼠標直接拖動，畫出表格即可。,利用表格構建頁面實例,常用網站頁面布局風格 1）“國”字型,常用網站頁面設置風格 2）“廠”字型,常用網站頁面設置風格 3）封面型,注意事項： 使用表格進行排版，表格嵌套的層數不宜太多，否則會影響用戶的瀏覽速度。 瀏覽器在下載網頁時，先下載整個表格，再下載表格里的內容，因

5、此，在用表格布置頁面時，不能將整個網頁的內容都放在一個表格中，以免影響網頁的下載速度。,第二節(jié) 層的創(chuàng)建、管理和應用 1 創(chuàng)建層及層的屬性 2 用層面板管理層 3 層的應用 4 層與表格的相互轉換,1 創(chuàng)建層及層的屬性 層是網頁中用來放置表格、文本、圖像、動畫、表單、插件等網頁元素的載體。層也是一種為網頁元素的定位工具，利用層能夠精確對頁面元素定位。 創(chuàng)建層的操作步驟 1）在文檔中，將光標停留在要插入圖層的位置。 2）選擇菜單【插入】|【布局對象】|【層】命令，或者在工具面板中單擊插入圖層按鈕，此時在文檔窗口中鼠標會呈十字形，拖動鼠標，畫出所需的圖層大小，這樣就插入了一個圖層。,插入多個層 操

6、作步驟 如果希望插入多個層，可以按下面步驟進行： 步驟一：單擊插入層按鈕，此時鼠標呈十字狀。 步驟二：按住CTRL鍵不放，在文檔窗口中畫出一個層之后，可以再繼續(xù)畫新的圖層。,設置層的屬性 （1）層ID欄：用來設置層的名稱。 （2）左、上兩欄：設置當前層相對于頁面或父層的左上角距離。 （3）Z索引值欄：設置層的編號，即堆疊順序，Z值小的層在下面。 （4）顯示欄：定義生成的層是可見還是不可見。 （5）背景圖片欄：在文本框中指定層的背景圖片。 （6）背景顏色欄：指定層的背景顏色值。 （7）剪輯欄：用來定義層中的可見域的大小。 （8）溢出欄：若層中的內容超出層的范圍時，設置處理方式。,溢出處理方式：,

7、Visible增加尺寸，顯示超出部分內容 Hidden保持層尺寸不變，隱藏超出部分內容 Scroll增加滾動條 Auto內容超出尺寸時自動加滾動條,用層面板管理層 選擇菜單【窗口】|【其他】|【層】命令， 或按F2功能鍵打開層面板。操作如下： （1）選定某個層：在層面板中單擊該層。 （2）更改層名：雙擊層名稱 （3）顯示、隱藏層：單擊層面板左邊的顯示與隱藏列 （4）改變層的疊放次序：修改Z列的值。 （5）創(chuàng)建和取消嵌套層：按住Ctrl鍵，在層面板中拖曳子層到父層上，當父層上出現黑框時松開鼠標，便可創(chuàng)建一個嵌套層。將子層拖離父層即可取消嵌套層。 （6）禁止層重疊：對層操作時禁止各層重疊，創(chuàng)建嵌套

8、層時必須取消“防止重疊”復選框。,注意： 嵌套層（子層）可隨父層移動而移動，可繼承父層的可見屬性，也可另外設置可見屬性。 嵌套層在頁面上顯示時并不一定位于其父層中，它的HTML代碼嵌套在其父層的HTML代碼中，它的層標記顯示在其父層中。如果從頁面上看到某一層位于另一層之中，而它們的HTML代碼互不包含，就不是嵌套層。,3 層的應用 用層與時間軸配，通過改變多個層的疊放次序、顯示或隱藏等屬性，可以做出有趣的動態(tài)效果。如，頁面上的飄浮對象、滾動字幕、自動顯示和隱藏的下拉式菜單等。,4 層與表格的相互轉換 1） 將表格轉換為層 菜單【修改】|【轉換】|【表格到層】命令 2） 層轉換為表格 菜單【修改】|