用表格制作網(wǎng)頁(yè)

　　你知道表格能做成網(wǎng)頁(yè)嗎?如果你知道，那你又知不知道怎么做呢?下面是學(xué)習(xí)啦小編為你整理的用表格制作網(wǎng)頁(yè)，希望對(duì)你有用!

　　利用表格制作網(wǎng)頁(yè)

　　實(shí)驗(yàn)?zāi)繕?biāo)

　　該網(wǎng)頁(yè)將利用設(shè)計(jì)頁(yè)面的布局，制楚雄師院的頁(yè)面簡(jiǎn)介。通過該種制作，我們可以體會(huì)到表格在布局設(shè)計(jì)中的實(shí)際運(yùn)用，體會(huì)如何使用表格來控制頁(yè)面中的元素對(duì)象，已達(dá)到自然，生動(dòng)的配置構(gòu)成元素的目的。

　　實(shí)驗(yàn)過程

　　《1》在dreamweaver中執(zhí)行《文件》中的《新建》命令，創(chuàng)建一個(gè)HTML文檔。然后在《文件》中保存該文檔。然后在《文檔》工具欄的《標(biāo)題》中輸入“師院首頁(yè)”。然后單擊《常用》工具欄的表格按鈕，插入一個(gè)3行3列的表格。

　　<2>選中第2行表格的第2單元格。單擊屬性面板中的合并所選單元格按鈕，將其合并。然后將指針置于第1行第1列單元格內(nèi)在屬性面板中將《寬》設(shè)為200，<高》設(shè)為30。

　　《3》單擊《常用》工具欄中的常用圖像按鈕，再打開的《選擇圖像源文件》對(duì)話框中選中一幅圖片，單擊《確定》按鈕，為單元的插入一幅圖片。

　　《4》將鼠標(biāo)指針移到第1行1列單元格內(nèi)，在屬性面板中將《寬》設(shè)為50，《高》設(shè)為30，單擊《常用》工具欄中的圖像按鈕，打開《插入鼠標(biāo)經(jīng)過圖像》對(duì)話框。

　　《5》在打開的< 插入鼠標(biāo)經(jīng)過圖像>對(duì)話框中，單擊《原始圖像》后面的《瀏覽》按鈕.。在打開的對(duì)話框中選中一幅圖片，單擊確定按鈕，在單擊《鼠標(biāo)經(jīng)過圖像》后面的《瀏覽》按鈕，用同樣的方法選定一幅圖片。

　　《6》設(shè)置完成后，單擊《確定》按鈕，然后同同第4,5步一樣為第1行的第1,2列也分別設(shè)置鼠標(biāo)經(jīng)過圖像。然后將鼠標(biāo)指針置于第一行第三列的單元格內(nèi)，在《屬性》面板中，為《寬》設(shè)為100，《高》。設(shè)為50。為《背景顏色》設(shè)為#333cc。

　　《7》將鼠標(biāo)指針置于表格的第3行，按前面的方法，為第3行單元格也插入一幅圖片。然后將鼠標(biāo)指針置于表格的下一行，單擊《常用》工具欄表格圖標(biāo)按鈕，為文檔在插入一個(gè)3行3列的表格。

　　《8》將鼠標(biāo)指針置于插入表格的第1行第1列中，在屬性面板中將《寬》。設(shè)為120，然后將鼠標(biāo)指針置于第1行第1列單元格內(nèi)，按下Ctrl+Alt+t組合鍵，打開《表格》對(duì)話框。設(shè)置好后，單擊《確定》按鈕，給單元格插入嵌套表格。

　　《9》選中插入的嵌套表格在屬性面板中將《對(duì)齊》設(shè)置為劇中右對(duì)齊。然后將鼠標(biāo)指針置于嵌套表格第一行中，按照前面的方法，為其插入一幅圖片。同樣的，為其第2,3,4,5列也分別插入圖片。

　　《10》在屬性面板中，將第6列單元格的《高》設(shè)為50，再將鼠標(biāo)指針置于第7列，為其插入一幅圖片。單擊《狀態(tài)欄》中的《tatle》標(biāo)簽，選中第7步插入的3行3列的表格，在屬性面板中，為《背景顏色》設(shè)置為#009966。

　　《11》將鼠標(biāo)指針置于7步插入表格的第2行2列中，在屬性面板中，將《垂直》設(shè)置為頂端。打開《表格》對(duì)話框，其中的設(shè)置如圖11所示。設(shè)置完后，單擊《確定》按鈕，為單元格插入嵌套。

　　《12》在上一步插入表格的屬性面板中，將對(duì)齊方式設(shè)為居中對(duì)齊，將鼠標(biāo)置于該表格的第2行，按下ctrl+alt+I組合鍵，在打開的對(duì)話框中選擇一幅圖，單擊確定，為單元格插入圖片。在該單元格的屬性面板中，單擊居中對(duì)齊按鈕，將圖片居中。

　　《13》將光標(biāo)置于下1列單元格，輸入文字。在網(wǎng)頁(yè)中右擊，在彈出的快捷鍵菜單中執(zhí)行《CSS樣式》的新建命令，彈出《新建CSS規(guī)則》對(duì)話框。按照設(shè)置后，單擊《確定》按鈕，彈出《X1的規(guī)則定義》對(duì)話框。

　　《14》在《X1規(guī)則定義》對(duì)話框中，將《文字》設(shè)為宋體，《大小》設(shè)為12像素，，《樣式》設(shè)為正常，<行高>設(shè)為26像素,其余不變.單擊<確定>按鈕，在編輯窗口選中輸入的文字，右擊，在彈出的快捷菜單中執(zhí)行《CSS樣式》的x1命令，為文字應(yīng)用css樣式。

　　《15》將鼠標(biāo)指針置于第7步插入的3行2列表格的下一行，然后按下ctrl+Alt+T組合鍵打開《表格》對(duì)話框，設(shè)置完畢后，單擊《確定》按鈕，為網(wǎng)頁(yè)插入表格。

　　《16》選中上一步插入的表格，在屬性面板中，將《背景顏色》設(shè)為#99FF66。將鼠標(biāo)指針設(shè)置于第1行單元格內(nèi)，在屬性面板中，將《水平》設(shè)為右對(duì)齊，然后為該單元格插入一幅圖片。

　　《17》將鼠標(biāo)指針置于定2行單元格內(nèi)，在屬性面板中，將《格式》設(shè)為段落，《水平》設(shè)為右對(duì)齊，然后輸入師院信息。在網(wǎng)頁(yè)中右擊，在彈出的快捷鍵菜單中執(zhí)行《css樣式》的《新建》命令彈出《新建css規(guī)則》對(duì)話框。

　　《18》《新建css規(guī)則》對(duì)話框的設(shè)置如圖18所示，設(shè)置好后，單擊《確定》按鈕。彈出《x2的規(guī)則定義》對(duì)話框，將《大小》設(shè)為19像素，《樣式》設(shè)為正常，《行高》設(shè)為20像素，《顏色》設(shè)為，其余不變。設(shè)置完畢后，單擊確定按鈕。

　　《19》在編輯窗口選中輸入的文字，右擊在彈出的快捷菜單中執(zhí)行《css樣式》的《x2》命令，為文字應(yīng)用css樣式。按下ctrl+s組合保存文件，按下F12鍵預(yù)覽在IE中。

　　什么是表格

　　表格，是指按所需的內(nèi)容項(xiàng)目畫成格子，分別填寫文字或數(shù)字的書面材料，便于統(tǒng)計(jì)查看。是人們表達(dá)解釋事務(wù)性質(zhì)所運(yùn)用的數(shù)據(jù)傳達(dá)形式，在經(jīng)濟(jì)領(lǐng)域或者統(tǒng)計(jì)活動(dòng)中運(yùn)用很是廣泛。

　　在Microsoft Office 中：

　　表格：表格由一行或多行單元格組成，用于顯示數(shù)字和其他項(xiàng)以便快速引用和分析。表格中的項(xiàng)被組織為行和列。

　　表格由行，列，單元格三個(gè)部分組成。

　　在現(xiàn)實(shí)生活中：

　　表格應(yīng)用于各種軟件中,有表格應(yīng)用軟件也有表格控件,典型的像Office word,excel, 表格是最常用的數(shù)據(jù)處理方式之一，主要用于輸入、輸出、顯示、處理和打印數(shù)據(jù)，可以制作各種復(fù)雜的表格文檔，甚至能幫助用戶進(jìn)行復(fù)雜的統(tǒng)計(jì)運(yùn)算和圖表化展示等。表格控件還可常用于數(shù)據(jù)庫(kù)中數(shù)據(jù)的呈現(xiàn)和編輯、數(shù)據(jù)錄入界面設(shè)計(jì)、數(shù)據(jù)交換(如與Excel交換數(shù)據(jù))、數(shù)據(jù)報(bào)表及分發(fā)等。比如Spread,ComponentOne的FlexGrid。而隨著互聯(lián)網(wǎng)時(shí)代的發(fā)展，現(xiàn)在還能在網(wǎng)上做表格，簡(jiǎn)稱“網(wǎng)表”或“在線表格”。

　　表格的HTML基本語(yǔ)法

　　<table>...</table> - 定義表格

　　<tr> - 定義表行

　　<th> - 定義表頭

　　<td> - 定義表元(表格的具體數(shù)據(jù))

　　什么是網(wǎng)頁(yè)

　　網(wǎng)頁(yè)是一個(gè)文件，通常是HTML格式(文件擴(kuò)展名為.html或.htm)。網(wǎng)頁(yè)通常用圖像檔來提供圖畫。網(wǎng)頁(yè)通常要透過網(wǎng)頁(yè)瀏覽器來閱讀。根據(jù)W3C對(duì)于WEB PAGE的定義，網(wǎng)頁(yè)是一個(gè)信息的集合，其內(nèi)容包含一個(gè)或多個(gè)網(wǎng)絡(luò)資源的信息，同時(shí)預(yù)期使其成為單一個(gè)URI。進(jìn)一步說，一個(gè)網(wǎng)頁(yè)其包含一個(gè)或多個(gè)嵌入于網(wǎng)頁(yè)中的網(wǎng)絡(luò)資源使其成為單一個(gè)URI檔案(HTML)，而該URI并 不再嵌入于其他檔案之中。

　　網(wǎng)頁(yè)是構(gòu)成網(wǎng)站的基本元素，是承載各種網(wǎng)站應(yīng)用的平臺(tái)。通俗地說，您的網(wǎng)站就是由網(wǎng)頁(yè)組成的，如果您只有域名和虛擬主機(jī)而沒有制作任何網(wǎng)頁(yè)的話，您的客戶仍舊無(wú)法訪問您的網(wǎng)站。

　　網(wǎng)頁(yè)是一個(gè)文件，他存放在世界某個(gè)角落的某一部計(jì)算機(jī)中，而這部計(jì)算機(jī)必須是與互聯(lián)網(wǎng)相連的。網(wǎng)頁(yè)經(jīng)由網(wǎng)址(URL)來識(shí)別與存取，是萬(wàn)維網(wǎng)中的一“頁(yè)”，是超文本標(biāo)記語(yǔ)言格式(標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言的一個(gè)應(yīng)用，文件擴(kuò)展名為.html或.htm)。網(wǎng)頁(yè)通常用圖像檔來提供圖畫。網(wǎng)頁(yè)要透過網(wǎng)頁(yè)瀏覽器來閱讀。

　　靜態(tài)網(wǎng)頁(yè)

　　靜態(tài)網(wǎng)頁(yè)，其內(nèi)容是預(yù)先確定的，并存儲(chǔ)在Web服務(wù)器或者本地計(jì)算機(jī)/服務(wù)器之上。

　　特點(diǎn)：

　　1，制作速度快，成本低

　　2，模板一旦確定下來，不容易修改，更新比較費(fèi)時(shí)費(fèi)事

　　3，常用于制作一些固定板式的頁(yè)面。

　　4，通常用于文本和圖像組成，常用于子頁(yè)面的內(nèi)容介紹。

　　動(dòng)態(tài)網(wǎng)頁(yè)

　　動(dòng)態(tài)網(wǎng)頁(yè)，是取決于由用戶提供的功能，并根據(jù)存儲(chǔ)在數(shù)據(jù)庫(kù)中的網(wǎng)站上的數(shù)據(jù)中創(chuàng)建的頁(yè)面。

　　儲(chǔ)存

　　當(dāng)要將網(wǎng)頁(yè)存入自己的電腦內(nèi)，網(wǎng)頁(yè)瀏覽器通常提供以下的選擇：

　　只儲(chǔ)存網(wǎng)頁(yè)的文字部分完裝封裝，即連同該網(wǎng)頁(yè)(HTML)所要用到的圖像、Applet和JavaScript等文件也一并封裝儲(chǔ)存只有HTML，不作任何改動(dòng);若果網(wǎng)頁(yè)內(nèi)的連結(jié)是相對(duì)連結(jié)，可能會(huì)令圖片消失只有HTML，但將網(wǎng)頁(yè)內(nèi)連結(jié)到的文件改成絕對(duì)定義有些網(wǎng)頁(yè)瀏覽器容許在打印網(wǎng)頁(yè)前預(yù)覽，并可選擇印底色與否，甚至放大、縮小。