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

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

　　實驗目標

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

　　實驗過程

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

　　什么是表格

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

　　在Microsoft Office 中：

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

　　表格由行，列，單元格三個部分組成。

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

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

　　表格的HTML基本語法

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

　　<tr> - 定義表行

　　<th> - 定義表頭

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

　　什么是網(wǎng)頁

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

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

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

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

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

　　特點：

　　1，制作速度快，成本低

　　2，模板一旦確定下來，不容易修改，更新比較費時費事

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

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

　　動態(tài)網(wǎng)頁

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

　　儲存

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

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