第九章使用表格布局頁面

使用表格布局頁面課程代碼：課程介紹目的：通過學(xué)習(xí)掌握使用表格布局頁面。內(nèi)容:

頁面布局是進(jìn)行網(wǎng)頁設(shè)計(jì)最基本最重要的工作之一。用于網(wǎng)頁布局設(shè)計(jì)的常用工具是表格。重點(diǎn)：制作表格的方法,表格數(shù)據(jù)的處理。難點(diǎn)：使用表格進(jìn)行頁面布局。

制作表格的方法表格數(shù)據(jù)的處理使用其他模式進(jìn)行頁面布局在頁面中使用表格進(jìn)行排版

使用表格布局頁面

選擇表格添加與刪除行或列合并與拆分單元格設(shè)置表格整體屬性表格的嵌套表格數(shù)據(jù)的處理頁面布局是進(jìn)行網(wǎng)頁設(shè)計(jì)最基本、最重要的工作之一。用于網(wǎng)頁布局設(shè)計(jì)的常用工具是表格。合理布局表格，會(huì)使網(wǎng)頁更具有自身的特點(diǎn)，也可便于管理和修改。制作表格的方法插入表格表格是整個(gè)網(wǎng)頁設(shè)計(jì)的精華，它具有輸入數(shù)據(jù)和進(jìn)行分類列表的功能，而且當(dāng)前許多網(wǎng)站都用表格來協(xié)助網(wǎng)頁的排版。表格為Web頁帶來了結(jié)構(gòu)的概念?，F(xiàn)在，Web頁設(shè)計(jì)者已經(jīng)把表格當(dāng)作控制Web頁面布局的重要的工具。Dreamweaver可以在另一個(gè)應(yīng)用程序中創(chuàng)建并以分隔文本的格式（其中的項(xiàng)以制表符、逗號(hào)、冒號(hào)或分號(hào)隔開）保存的表格式數(shù)據(jù)導(dǎo)入到Dreamweaver中并設(shè)置為表格格式。導(dǎo)入外部鏈接數(shù)據(jù)文件表格是用于在HTML頁上顯示表格式數(shù)據(jù)以及對(duì)文本和圖形進(jìn)行布局的強(qiáng)有力的工具。表格由一行或多行組成；每行又由一個(gè)或多個(gè)單元格組成。在網(wǎng)頁中，表格用于網(wǎng)頁內(nèi)容的排版，如文字放在頁面的哪個(gè)位置，可以使用表格來解決這個(gè)問題。下面來介紹表格的基本操作。表格數(shù)據(jù)的處理像處理文本或圖像一樣，首先需要選擇表格,然后才是修改編輯。在Dreamweaver中用戶可以一次選定全部表格、一行、一列或幾個(gè)連續(xù)的單元格，也可以選定表格中不連續(xù)的單元格，然后通過屬性面板來修改它們的屬性。選擇表格表格創(chuàng)建后，可能需要添加內(nèi)容而添加行或列。用戶可以使用不同方法在表格中的幾乎任何地方添加行或列。添加與刪除行或列在使用表格的過程中，有時(shí)需要拆分單元格以達(dá)到最終的效果。拆分單元格就是將選中的單元格拆分為多行或多列。合并與拆分單元格在AdobeDreamweaverCS5中為了使創(chuàng)建的表格更加美觀、醒目，需要對(duì)表格屬性進(jìn)行設(shè)置。設(shè)置表格整體屬性嵌套表格是指在另一個(gè)表格的單元格中插入表格，可以其他表格一樣對(duì)嵌套表格進(jìn)行相應(yīng)的設(shè)置，嵌套表格最大的優(yōu)點(diǎn)在于它為用戶提供了最大程度上對(duì)網(wǎng)頁頁面布局進(jìn)行控制的能力。表格的嵌套在網(wǎng)頁設(shè)計(jì)過程中，可以通過多種方法來布局版面，利用Dreamweaver提供的布局視圖就可以不使用一般表格模式中的插入表格的對(duì)話框，直接通過拖動(dòng)操作就能夠在文檔中插入表格和單元格，簡(jiǎn)化制作表格的煩瑣操作，這樣我們就能夠輕松設(shè)計(jì)出靈活而復(fù)雜的頁面。使用其他模式進(jìn)行頁面布局創(chuàng)建頁布局的一種常用的方法是使用HTML表格對(duì)元素進(jìn)行定位。最初創(chuàng)建表格是為了顯示表格式數(shù)據(jù)，而不是用于對(duì)網(wǎng)頁進(jìn)行布局；使用嵌套表格進(jìn)行頁面布局的過程，表格的編輯及操作會(huì)變得困難，此時(shí)Dreamweaver提供了“擴(kuò)展表格”模式。使用擴(kuò)展表格模式編輯表格AP元素（絕對(duì)定位元素）就是div標(biāo)簽的一種類型。AP元素可以包含文本、圖像或其它任何可放置到HTML文檔正文中的內(nèi)容。同表格一樣，我們也可以使用AP元素來設(shè)計(jì)頁面的布局。同時(shí)，由于AP元素的特有屬性，我們可以將AP元素放置到其它AP元素的前后，隱藏某些AP元素而顯示其它AP元素，以及在屏幕上移動(dòng)AP元素等。使用APIT使用布局版面進(jìn)行布局的過程，實(shí)際也是繪制表格的過程。根據(jù)頁面布局的需要，表格可能會(huì)比較簡(jiǎn)單，也可能會(huì)非常復(fù)雜。利用布局視圖，我們可以像繪圖一樣，在頁面上任意位置繪制表格和單元格。設(shè)置AP元素的屬性使用布局版面進(jìn)行布局的過程，實(shí)際也是繪制表格的過程。根據(jù)頁面布局的需要，表格可能會(huì)比較簡(jiǎn)單，也可能會(huì)非常復(fù)雜。利用布局視圖，我們可以像繪圖一樣，在頁面上任意位置繪制表格和單元格。在頁面中使用表格進(jìn)行排版本章小結(jié)在網(wǎng)頁設(shè)計(jì)中，最常用就是使用表格來定位內(nèi)容，表格是大家在網(wǎng)頁的整體布局中使用最廣的。這一方面是因?yàn)楸砀竦男畔⒆畲?，它用最?jiǎn)潔的形式表達(dá)繁雜的內(nèi)容，另一方面它還可以用來控制文本和圖像在頁面上出現(xiàn)的位置，把文字和圖像規(guī)范地按照行或列對(duì)齊，使整個(gè)頁面看上去緊湊而統(tǒng)一。這對(duì)于復(fù)雜版面的網(wǎng)頁排版來說，有很大的幫助，對(duì)于一個(gè)網(wǎng)頁設(shè)計(jì)者來說，如果能夠靈活地應(yīng)用表格，就會(huì)讓你的網(wǎng)頁看上去井井有條、美觀大方。思考與練習(xí)一、選擇題1.在代碼視圖中，表格使用的標(biāo)簽是（）

A.<td> B.<table>C.<tr> D.<div>2.下列視圖中不屬于Dreamweaver進(jìn)行頁面布局的視圖（）

A.標(biāo)準(zhǔn)視圖

B.布局視圖C.擴(kuò)展視圖

D.表格視圖思考與練習(xí)3.在Dreamweaver中，若將*.txt的文本文件導(dǎo)入為表格，主要依靠什么來進(jìn)行識(shí)別（）

A.文字字體

B.文字顏色C.定界符

D.文字大小4.插入表格得快捷鍵是（）

A.Ctrl+Alt+T B.Alt+TC.Ctrl+T D.Ctrl+Alt+A思考與練習(xí)5.在表格“屬性”面板中，哪種不是表格得對(duì)齊方式（