ID:39248145
大?。?.95 MB
頁數(shù):50頁
時(shí)間:2019-06-28
《應(yīng)用表格布局-《網(wǎng)頁設(shè)計(jì)制作》》由會(huì)員上傳分享,免費(fèi)在線閱讀,更多相關(guān)內(nèi)容在教育資源-天天文庫。
1、最終效果圖完成頁面布局一個(gè)簡(jiǎn)單示例本章導(dǎo)讀學(xué)會(huì)插入表格掌握表格的基本操作學(xué)會(huì)設(shè)置表格屬性掌握表格的高級(jí)操作第4章表格的應(yīng)用學(xué)習(xí)目標(biāo)頁面布局是網(wǎng)頁制作的一個(gè)重要部分,使用表格布局頁面是一種最常用的手段。本章將學(xué)習(xí)在網(wǎng)頁中插入表格以及表格的操作,讓讀者熟練掌握對(duì)表格的使用。本章要點(diǎn)插入表格表格的基本操作設(shè)置表格屬性表格的高級(jí)操作4.1插入表格在網(wǎng)頁制作中,表格的功能較多,可用表格對(duì)網(wǎng)頁中的文本、圖像及其他元素進(jìn)行定位,也可有序地排列數(shù)據(jù)等,為網(wǎng)頁制作提供了很大的方便。下面將講解表格的創(chuàng)建方法以及如何添加表格的內(nèi)容。3.1插入表格
2、3.1.1插入表格的方法3.1.2嵌套表格的創(chuàng)建3.1.3在表格中添加內(nèi)容3.1.4應(yīng)用舉例——在網(wǎng)頁中插入表格并添加網(wǎng)頁元素3.1.1插入表格的方法表格不僅可以為頁面進(jìn)行宏觀的布局,還可以使頁面中的文本、圖像等元素更有條理。一張表格橫向叫行,縱向叫列。行列交叉部分就叫做單元格。單元格中的內(nèi)容和邊框之間的距離叫邊距。單元格和單元格之間的距離叫間距。整張表格的邊緣叫做邊框。3.1.2嵌套表格的創(chuàng)建表格可進(jìn)行嵌套。嵌套表格是指在表格的某個(gè)單元格中再插入一個(gè)表格,其寬度受所在單元格的寬度限制。當(dāng)單個(gè)表格不能滿足布局的需求時(shí),可以進(jìn)
3、行嵌套表格的創(chuàng)建。3.1.3在表格中添加內(nèi)容在表格中可添加各種網(wǎng)頁元素。添加表格內(nèi)容的方法很簡(jiǎn)單,只需將光標(biāo)插入點(diǎn)定位到所需的單元格中,然后按照添加網(wǎng)頁元素的方法操作即可。3.1.4應(yīng)用舉例——在網(wǎng)頁中插入表格并添加網(wǎng)頁元素下面為“繁花似錦”網(wǎng)頁進(jìn)行表格的添加和網(wǎng)頁元素的添加。最終效果圖3.2表格的基本操作通常插入的表格并不符合要求,這時(shí)可根據(jù)實(shí)際情況對(duì)表格進(jìn)行一些基本操作,如合并及拆分單元格、刪除和添加行或列等。3.2表格的基本操作3.2.1選中操作3.2.2單元格的合并及拆分3.2.3插入、刪除行或列3.2.1選中操作在
4、對(duì)表格進(jìn)行操作之前需先將表格選中??梢赃x中整個(gè)表格,也可以只選中某行或某列甚至某個(gè)單元格。3.2.1選中操作1.整個(gè)表格的選中2.行或列的選中3.單元格的選中1.整個(gè)表格的選中選中整個(gè)表格有以下幾種方法:?將光標(biāo)移到表格邊框線上,當(dāng)邊框線為紅色且光標(biāo)變?yōu)樾螤顣r(shí),單擊鼠標(biāo)左鍵即可。?將光標(biāo)移到表格的邊框上,當(dāng)鼠標(biāo)光標(biāo)變?yōu)榛虻男螤顣r(shí)單擊鼠標(biāo)即可。?將光標(biāo)插入點(diǎn)定位到表格的任一單元格中,單擊窗口左下角標(biāo)簽選擇器中的
標(biāo)簽即可。?將光標(biāo)插入點(diǎn)定位到表格的任意單元格中,表格上端或下端將彈出綠線的標(biāo)志,單擊最上端標(biāo)有表格寬度5、的綠線中的按鈕,如這里單擊按鈕,在彈出的快捷菜單中選擇“選擇表格”命令即可。2.行或列的選中行、列的選中方法如下:?將光標(biāo)移到所需行的左側(cè),當(dāng)光標(biāo)變?yōu)樾螤钋以撔械倪吙蚓€變?yōu)榧t色時(shí)單擊鼠標(biāo)即可選中該行。?將光標(biāo)移到所需列的上端,當(dāng)光標(biāo)變?yōu)樾螤钋以摿械倪吙蚓€變?yōu)榧t色時(shí)單擊鼠標(biāo)左鍵即可選中該列。3.單元格的選中單個(gè)單元格的選中與多個(gè)單元格的選中操作不相同,下面將分別介紹。1)單個(gè)單元格的選中2)多個(gè)單元格的選中3.2.2單元格的合并及拆分為了更好地對(duì)網(wǎng)頁進(jìn)行布局,在使用表格時(shí)常常需要把單元格進(jìn)行拆分或合并,特別是在頁面內(nèi)容非常多的
6、情況下,更加需要這些操作。3.2.2單元格的合并及拆分1.單元格的拆分2.單元格的合并1.單元格的拆分當(dāng)表格中的單元格不夠使用時(shí),可將單元格拆分。2.單元格的合并合并單元格的操作比較簡(jiǎn)單,選中要合并的單元格區(qū)域并單擊“屬性”面板左下角的按鈕即可。3.2.3插入、刪除行或列在進(jìn)行網(wǎng)頁制作時(shí),若插入表格的行、列不夠或行、列太多,則可根據(jù)實(shí)際情況進(jìn)行插入或刪除行、列的操作。3.2.3插入、刪除行或列1.行或列的插入2.行或列的刪除1.行或列的插入行或列的插入有單行、單列的插入和多行、多列的插入兩種情況。1)單行或單列的插入2)多行
7、或多列的插入插入單行或單列插入多行或多列“修改”>“表格”>“插入行或列”2.行或列的刪除將光標(biāo)插入點(diǎn)定位到所需單元格中,單擊鼠標(biāo)右鍵,在彈出的快捷菜單中選擇“表格/刪除行”命令可刪除光標(biāo)插入點(diǎn)所在的行;選擇“表格/刪除列”命令可刪除光標(biāo)插入點(diǎn)所在的列。3.3表格屬性在“屬性”面板中可對(duì)表格進(jìn)行寬度、邊框粗細(xì)、對(duì)齊、背景顏色或背景圖像等的屬性設(shè)置。3.3表格屬性8.3.1設(shè)置表格屬性8.3.2設(shè)置單元格屬性3.3.1設(shè)置表格屬性選中表格后,“屬性”面板可在其中進(jìn)行各項(xiàng)設(shè)置。?“表格Id”下拉列表框?“行”和“列”文本框?“寬
8、”和“高”文本框?“填充”文本框?“間距”文本框?“對(duì)齊”下拉列表框?“邊框”文本框?“邊框顏色”文本框3.3.1設(shè)置表格屬性?“背景顏色”文本框?“背景圖像”文本框?單擊按鈕可刪除表格的列寬值。?單擊按鈕可刪除表格的行高值。?單擊按鈕可將表格寬度單位從瀏覽器窗口的百分比轉(zhuǎn)換為像素。?單擊
此文檔下載收益歸作者所有
微信/支付宝扫码支付下载
扫描成功:
请在手机上确认支付
绑定手机
强烈建议绑定手机号,方便下次登录再次下载,查询订单记录