網(wǎng)頁制作基礎(chǔ)教程

1、網(wǎng)頁制作基礎(chǔ)教程一、什么是HTMLHTML（超文本標(biāo)記語言）是網(wǎng)頁中使用的語言，他能被網(wǎng)頁瀏覽器（IE或Netscape）解釋，從而顯示出豐富多彩的信息（圖片、文字、聲音、影象、動畫等）。制作網(wǎng)頁前首先要弄懂什么是HTML。在IE中點(diǎn)擊查看源文檔，就能看到該網(wǎng)頁的HTML代碼。下面是個網(wǎng)頁文檔（model.htm）的HTML代碼：這里是標(biāo)題第一段文字。第二段文字?！静僮鳌空?jiān)谟浭卤局休斎胍陨洗a，命名為test1.htm，存于D盤，然后雙擊打開看看。標(biāo)記一般是成對出現(xiàn)的，#FFFFFF表示使用的顏色是白色。.之間是該網(wǎng)頁的標(biāo)題charset=gb2312表示語言字符集信息是中文簡體，如big5

2、則是中文繁體。.之間是網(wǎng)頁的正文內(nèi)容表示網(wǎng)頁的背景色是白色，默認(rèn)的文字顏色是白色。.之間是h1號標(biāo)題字.之間是h2號標(biāo)題字.之間的文字為紅色HTML是一套國際標(biāo)準(zhǔn)，其標(biāo)記有幾百種，您并無需全部了解他們，只要記住其中常用的十幾種，就能夠做出很漂亮的網(wǎng)頁來。常用的標(biāo)記舉例：標(biāo)記名稱標(biāo)記舉例解釋鏈接 . URL：鏈接的地址，如： 標(biāo)尺線劃一條橫線 換行人工換行 鏈入圖象如：images/face.gif 文字的對齊Hello元素中間對齊 Hello元素右對齊 Hello元素左對齊 表格.定義表格 定義表行 定義表頭 定義表元(表格的具體數(shù)據(jù)) 【操作】復(fù)制一個jpg

3、格式的圖片文檔，取名為pic，保存到D盤，在記事本中輸入下列語句，命名為test2.htm，存于D盤。這里是標(biāo)題第二個網(wǎng)頁鏈接到校園網(wǎng)鏈接到我的圖片鏈接到test1下面是個帶邊框的表格FoodDrinkSweetABC二、準(zhǔn)備工作 制作網(wǎng)頁前重要的工作是規(guī)劃好網(wǎng)頁的架構(gòu)，一般開設(shè)images、common、temp三個子目錄，根據(jù)需要再開設(shè)media子目錄，images目 錄中放不同欄目的頁面都要用到的公共圖片，例如網(wǎng)站的標(biāo)志、banner條、菜單、按鈕等；common子目錄中放css、js、php、include 等公共文檔；temp子目錄放各種臨時備用的文檔；media子目錄中放flash

4、、avi、quick time等多媒體文檔。在根目錄中原則上按照首頁的欄目結(jié)構(gòu)，給每一個欄目開設(shè)一個目錄，根據(jù)需要在每一個欄目的目錄中開設(shè)一個images和media的子目錄用以放置此欄目專有的圖片和多媒體文檔，假如這個欄目的內(nèi)容特別多，又分出很多下級欄目，能夠相應(yīng)的再開設(shè)其他目錄。除非有特別情況，目錄、文檔的名稱全部用小寫英文字母、數(shù)字、下劃線的組合，其中不得包含漢字、空格和特別字符；目錄的命名請盡量以英文為指導(dǎo)，不到萬不得已不要以拼音作為目錄名稱，經(jīng)驗(yàn)證實(shí)，用拼音命名的目錄往往一個月后連自己都看不懂。網(wǎng)站的首頁文檔一般取名：index.htm放置在頁面頂部的廣告、裝飾圖案等長方形的圖片取名

5、：banner標(biāo)志性的圖片取名：logo在頁面上位置不固定并且?guī)в墟溄拥男D片取名：button在頁面上某一個位置連續(xù)出現(xiàn)，性質(zhì)相同的鏈接欄目的圖片取名：menu裝飾用的照片取名：pic不帶鏈接表示標(biāo)題的圖片取名：title三、制作軟件介紹下面介紹3個做網(wǎng)頁的輔助軟件，有了軟件并不一定能夠把網(wǎng)頁做好，關(guān)鍵還得看懂HTML代碼具體表示什么意思。軟件名稱描述長處缺點(diǎn)如何獲取Microsoft FrontPage微軟Office套件之一，網(wǎng)頁制作解決方案，適合初、中級用戶使用和Word軟件的良好兼容，現(xiàn)成的各種模板操作、修改繁瑣，有冗余代碼Office套件里帶有Macromedia Dreamwea

6、verMacromedia公司的網(wǎng)頁制作3劍客之一（另外2個是Flash、Firework），適合專業(yè)用戶使用操作靈活，效率高，網(wǎng)頁可讀性好，解決IE和Netscape的兼容性幾乎沒有需要另外購買或下載東方網(wǎng)頁王5.0企業(yè)版國內(nèi)交大銘泰軟件公司的網(wǎng)頁制作解決方案，適合初級用戶使用操作簡便，形象直觀，模板豐富擴(kuò)展度不夠，制作不靈活，修改繁瑣需要另外購買或下載四、Dreamweaver初步（見演示）1工具欄2屬性欄3定義本地站點(diǎn)4編輯站點(diǎn)主頁5定義背景顏色和圖象6定義頁面標(biāo)題7創(chuàng)建鏈接8編輯表格五、網(wǎng)頁設(shè)計(jì)配色出色十例（1） 這是個大型的NBA網(wǎng)站。通常我們經(jīng)常看到的此類網(wǎng)站以白色為背景，但是這個

7、網(wǎng)站卻用灰黑色RGB為（48，48，48/#333333）（以下顏色都用 RGB表示），文章標(biāo)題用色為RGB為（203，201，153/#CCCC99），菜單使用的RGB為（112，119，112/#707770）。這 樣的配色能夠顯示獨(dú)特的個性，又不失大型網(wǎng)站的風(fēng)采。（2）下面是個娛樂類的綜合性網(wǎng)站UGO，他的配色方案是背景色為黑色RGB為（0，0，0）中嵌套RGB（0，0，82），字體白色 RGB（255,255,255）,菜單為RGB（77,114,159）。這樣的雖以黑藍(lán)為主色調(diào)，但是配以漂亮的圖片，給人的感覺是生機(jī)盎然，充滿了 互動色彩和青春氣息。（3） 下面的這個網(wǎng)站是大名鼎鼎的微

8、軟公司網(wǎng)站，微軟不但軟件做的好，連網(wǎng)頁制作也是世界一流。他的每一個網(wǎng)頁都是制作的樣板。從網(wǎng)頁我們就能夠看出微軟公司的 風(fēng)格、作風(fēng)，連同雄厚的實(shí)力。背景顏色使用藍(lán)色RGB為（0，151，254），菜單為黑色RGB（0，0，11），菜單為灰色 RGB（200，200，200），字體為黑色RGB（0，0，0）。（4） 現(xiàn)在介紹的網(wǎng)站相對簡單，但是她的用色也別具匠心，現(xiàn)在我們來看一看，整體上使用的是白色RGB（255，255，255），輔助色為 RGB（79，88，95），菜單色為RGB（48，64，64）和RGB（0，81，111）字體使用的是RGB（83，86，91）。雖然簡單，但顏 色搭配很的科

9、學(xué)合理。（5） 下面的網(wǎng)站采用黃色調(diào)為主，很體現(xiàn)公司的個性，現(xiàn)在我們就來看一看她的顏色搭配。主色調(diào)為黃色RGB為（255，199，48/#FFC730），輔助色 調(diào)為RGB（49，102，46）字體為棕色RGB（153，103，0），中間再配以抽象的圖片，顯得個性十足但又不單調(diào)。（6） 橘紅色假如運(yùn)用得當(dāng)?shù)脑捠且环N很使用于網(wǎng)頁上的顏色。下面的這個網(wǎng)站就是個很著名的例子。他的主色調(diào)為RGB（255，151，0）輔助色調(diào)為 RGB（255，103，4），菜單RGB為（252，200，0）。字體使用黑色RGB為（0，0，0）。此種配色顯得主人較為前衛(wèi)，色彩熱烈，給人的 震懾力較強(qiáng)。（7） 鮮紅色也是

10、一種震撼感很強(qiáng)的顏色，假如搭配不當(dāng)，也可能使網(wǎng)站沒有風(fēng)格和特點(diǎn)。下面的這個網(wǎng)站就是使用紅色比較好的網(wǎng)站。我們來看看他的顏色搭配。他使用 的主色調(diào)是RGB（200，9，0），配以抽象的圖像，文字使用的是RGB（213，229，167）顯得美觀而不失獨(dú)特，大氣而不逼人。（8） 下面介紹的這種色調(diào)是我們制作網(wǎng)頁的時候不會經(jīng)常用到的顏色，假如使用到您的網(wǎng)頁中，肯定會給人耳目一新的感覺。他的主色調(diào)為 RGB（144，151，97）輔助色調(diào)為RGB（173，168，112）邊飾為黑色RGB（0，0，0）字體為黑色RGB（0，0，0）。這樣的搭配 顯得風(fēng)格獨(dú)特，顏色和諧而莊重。（9） 下面的設(shè)計(jì)更加的簡單化

11、，但是顏色的使用使網(wǎng)頁并不呆板，反而讓人感覺到一股濃濃的生活和家庭氣氛，使人置身于美麗和愛中。他的主體是由兩種顏色構(gòu)成，分 別是RGB（239，200，161）和RGB（201，254，200）。如此簡單，但是卻栩栩如生，躍然網(wǎng)上。（10） 下面舉出這個例子是想證實(shí)一個道理只要您有足夠的想象力，您就能夠設(shè)計(jì)出漂亮的網(wǎng)頁?，F(xiàn)在在網(wǎng)上很流行一句話就是網(wǎng)頁的搭配不要超過四種主要顏色，否 則就有雜亂之感。下面的這個網(wǎng)站遠(yuǎn)遠(yuǎn)的超過了三種顏色，但是她并不失美麗。因此重要的還是色彩的駕馭能力。下面這個例子的菜單就使用了7種顏色，但是我們 看到的網(wǎng)頁并不雜亂，相反感覺作者很有創(chuàng)意。十一、制作滾動公告牌1、 在

12、頁面上插入一個層，然后為層配置一個背景，作為公告版的框架。2、 然后在創(chuàng)建的層中插入嵌套層，將嵌套層移動到父層的下方。3、 在嵌套層中輸入文本，并將其居中排列。4、 打開時間軸面板，將子層作為對象添加到面板中。5、 為子層創(chuàng)建一個向上移動的路徑，將其移動到父層的上方。6、 拖動最后一關(guān)鍵幀，增長動畫時間，然后勾選“自動播放”和“循環(huán)”兩項(xiàng)。7、 選定父層，在其屬性面板中將“溢出”屬性配置為“hidden”。十二、在頁面中運(yùn)用flash動畫1、 點(diǎn)擊插入中的Flash按鈕，即可為頁面插入一個動畫。也能夠選菜單插入/媒體/Flash來完成這一步。2、 選中已插入的動畫，看屬性面板。這里能夠配置他的

13、寬、高，也能夠通過拖動來改變大小。3、 能夠在這里點(diǎn)擊“播放”來預(yù)覽動畫。十三、讓插入的flash動畫變透明1、 當(dāng)網(wǎng)頁上已有背景，或是想要在一張圖片上再插入flash動畫，而flash動畫本身也有背景色，所以會影響美觀，這時我們要把他做成透明動畫。2、 如在頁面上插入一張圖像。3、 在圖像上插入一個層，在層中插入好所需要的flash動畫。4、 選中flash動畫，在屬性面板中點(diǎn)擊“參數(shù)”按鈕。5、 在“參數(shù)”的左面一格輸入“wmode”。在右面“值”一格輸入“transparent”。十四、在頁面中播放聲音1、 在完成全頁面以后，假如要為該頁添加背景音樂，注意背景音樂一般是*.midi文檔，

14、這樣的聲音文檔十分小，易于快速下載，其他格式不適合作為背景音樂。 2、 在頁面中任何表格之外，（注意此時編輯窗口左下方的標(biāo)簽選擇欄中僅顯示這一項(xiàng)，或是在左下角點(diǎn)一下，這 樣才能確保這個行為是添加在整個頁面上的）。點(diǎn)擊行為窗口上的“ ”按鈕，（或用菜單 窗口/行為，打開行為窗口。）3、 從彈出菜單中選擇“播放聲音”。打開一個對話框。4、 在這個對話框里用“瀏覽”選擇要播放的聲音，并確定。5、 這時行為面板上自動顯示了事件為onload，動作為播放聲音。點(diǎn)擊這一行，中間出現(xiàn)一個按鈕。點(diǎn)擊按鈕，能夠配置這個聲音在什么事件下播放。能夠選擇“顯示事件”/“IE5.0。6、 我們常用的如Onload（當(dāng)頁

15、面載入時）、OnClick（單擊鼠標(biāo)）、OnMouseOver（鼠標(biāo)移到對象上）、OnUnload(當(dāng)關(guān)閉頁面時)等。7、 該行為也能夠配置在圖片上、文字鏈接上。在文字鏈接上播放聲音之前，先為文字添加一個空鏈接，即選中文字，在鏈接一格里輸入一個“#”符號。十五、彈出窗口1、首先制作一個準(zhǔn)備在小窗口中顯示的頁面（比如a.htm）,由于這個彈出窗口不能太大，所以內(nèi)容要少一些。2、打開一個制作好的頁面，把光標(biāo)移到頁面中任何我表格以外，點(diǎn)擊行為窗口上的“ ”按鈕，從彈出菜單中選擇“打開瀏覽器窗口”一項(xiàng)。3、在對話框中里輸入相應(yīng)的配置。要顯示的URL即a.htm，窗口寬度和高度自己定，單位為像素。屬性中

16、的各項(xiàng)參數(shù)需要就打勾。4、 配置完畢后，點(diǎn)“確定”。此時行為窗口中將顯示打開瀏覽窗口這個行為，觸發(fā)條件為Onload，假如不是要這項(xiàng)，就自己配置。5、 該行為也能夠配置在圖片上、文字鏈接上。6、 能夠用這個方法來表示對瀏覽者的打開時的歡迎、網(wǎng)站公告、離開時的告別語等。十六、控制狀態(tài)欄信息1、 打開頁面，選中一張圖片。2、 點(diǎn)擊行為窗口上的“ ”號按鈕，選擇配置文本/配置狀態(tài)條文本。3、 在對話框里的“消息”一欄里，輸入需要顯示的話，如對這張圖片的介紹。4、 能夠配置行為的觸發(fā)條件為OnMouseOver（鼠標(biāo)移到對象上），這樣當(dāng)鼠標(biāo)經(jīng)過這張圖片的時候，狀態(tài)欄將出現(xiàn)相關(guān)的信息。5、 假如需要鼠標(biāo)

17、在移開后，這個信息消失，那么再次使用這個行為，在“消息”一欄里什么都不寫，然后把觸發(fā)條件改為OnMouseOut（鼠標(biāo)移開）。6、 同樣能夠在一段文字上配置該行為。或是配置在整個頁面上也能夠。十七、彈出信息1、 打開一個制作好的頁面，點(diǎn)左下角項(xiàng)。點(diǎn)擊行為窗口上的“ ”按鈕，從彈出菜單中選擇“彈出信息”一項(xiàng)。2、 在配置窗口中“消息”一欄里輸入想顯示的消息即可。3、 觸發(fā)條件配置為Onload（當(dāng)頁面載入時），就能夠用來作為打開頁面的歡迎信息。如設(shè)為OnUnload(當(dāng)關(guān)閉頁面時)，就能夠作為用戶關(guān)閉頁面時送別信息。4、 也能夠在某一段文字上配置彈出信息。比如一段文字不愿讓人復(fù)制，就選中整段文字

18、，注意此時左下角顯示P，即段落。5、 然后同樣操作，消息能夠輸入版權(quán)之類的語句。只是配置觸發(fā)條件為OnBeforeCopy（按右鍵時觸發(fā)）,或OnCopy（按右鍵選復(fù)制時觸發(fā)）。十八、動態(tài)圖片按鈕1、 準(zhǔn)備好兩張同樣大小的圖片，常用的方法是如一張為灰度照片，一張為彩色照片。或一張是按鈕凹下的樣式，一張是按鈕凸起的樣式。2、 舉例：插入一個3行1列的表格，配置寬度為180像素。3、 將光標(biāo)置于第一行，插入一張灰度的圖片。4、 在屬性面板中“鏈接”一欄里輸入需要鏈接的地址，并給圖片加上名稱，如tu1.5、 點(diǎn)擊行為窗口上的“ ”按鈕，從彈出菜單中選擇“交換圖像”。6、 此時在“圖像”一欄中已顯示要

19、交換的圖像，然后在“廟宇原始檔為”一欄里選擇好交換后的那張圖。7、 下面有兩個參數(shù)，“預(yù)先載入圖像”和“鼠標(biāo)滑開時恢復(fù)圖像”，都要選中。8、 同樣方法創(chuàng)建另外兩個動態(tài)按鈕。十九、用框架布局頁面框架由兩個主要部分組成框架集和單個框架。1、 點(diǎn)擊插入中的框架，即顯示出已定義的13種框架的樣式。我們上中下結(jié)構(gòu)為例。2、 點(diǎn)擊“上中下”框架結(jié)構(gòu)的圖標(biāo)，此時在頁上插入上下兩個框架，將整個頁面分割成了3部分。我們分別在上面輸入“上”，在中間輸入“中”，在下面輸入“下”。 3、 先保存一下。點(diǎn)擊菜單中的文檔/保存全部。這時首先保存框架集文檔，能夠自己修改名字，如kuangjia.htm。然后將分別保存框架集

20、中的其他頁面。 在保存對應(yīng)的頁面的時候，該部分會以虛線框起來，這樣可將上面部分保存為shang.htm。下面部分保存為xia.htm。中間部分保存為 zhong.htm。4、至此，我們保存了四個頁面，分別是框架集，和組成框架集的上、中、下三個頁面。所以，其實(shí)這個框架是由四個頁面組成的，所以用框架會降低一點(diǎn)用戶瀏覽的速度。5、點(diǎn)擊窗口/其他/框架，打開框架的面板。在這里單擊某個框架，即可選中該框架。當(dāng)框架被選中時，編輯窗口中對應(yīng)的框架出現(xiàn)虛線。6、 如：選中上面topframe,此時屬性面板上顯示的是上面這個框架的屬性。同樣選中中間框架和下面框架，也能夠分別配置他們的屬性。7、 在編輯窗口中，將

21、鼠標(biāo)放在兩框架之間的邊框上，光標(biāo)將變成上下箭頭形，此時點(diǎn)擊邊框，選中的是整個框架集。8、 此時屬性面板上出現(xiàn)的是整個框架組的屬性。能夠在此配置框架集是否有邊框、寬度及顏色等。但是最為重要的是能夠在這里配置框架集中各個框架的大小。9、 在屬性面板的右面的圖示上選中上面框架，配置他的行為80像素，邊框?yàn)?。10、選中下面框架，配置行高為30像素，邊框?yàn)?。11、選中中間框架，配置行高為1，單位為相對。（相對的意思是：當(dāng)前行相對于其他行所占的比例。設(shè)為1就是指占據(jù)除上和下以后的任何瀏覽窗口剩余空間。 12、舉例：將光標(biāo)置于上面框架topFrame上，右鍵選頁面屬性，配置背景色為#FF6600。然后插

22、入/表格，插入一個1行2列，邊框邊距都為0 的表格。配置第1個單元格的寬度為116像素，然后插入一張圖片。將第2個單元格配置為水平對齊方式為居中，垂直排列方式為底部，然后依次輸入“獅子座 ”、“魔蝎座”、“雙子座”字樣。13、將光標(biāo)置于中部框架mainFrame中，右鍵選頁面屬性，配置背景色為#FFFFCC。然后插入一張大圖像。14、將光標(biāo)置于下面框架bottomFrame中，右鍵選頁面屬性，配置一個背景圖像。15、另外做好三個頁面，作為“獅子座”、“魔蝎座”、“雙子座”所要鏈接的頁面。16、選中“獅子座”，在屬性中為他配置好要鏈接的頁面，然后在“目標(biāo)”里選“mainframe”，即該內(nèi)容在中

23、間那個框架中顯示。17、同樣配置“魔蝎座”、“雙子座”的鏈接。二十、跳轉(zhuǎn)菜單1、 點(diǎn)擊主菜單中的插入/表單對象/跳轉(zhuǎn)菜單，也能夠用插入/表單，中的跳轉(zhuǎn)菜單圖標(biāo)，來調(diào)出跳轉(zhuǎn)菜單配置窗口。2、 首先在“文本”一欄里輸入“請選擇相關(guān)網(wǎng)站”字樣。然后點(diǎn)擊窗口上的“ ”號按鈕。這時菜單里多了一個選項(xiàng)，這個選項(xiàng)沒有鏈接，僅作為跳轉(zhuǎn)菜單的說明文字。3、 在文一欄里輸入需要的網(wǎng)站，如“新浪”，然后在“選擇時，前往URL”一欄里輸入網(wǎng)站鏈接地址，此時，菜單項(xiàng)一欄里又多了一個選項(xiàng)，這個選項(xiàng)對應(yīng)一個網(wǎng)的鏈接地址。4、 使用同樣方法，在菜單中添加其他一些選項(xiàng)及對應(yīng)的鏈接。還能

24、夠用“上”“下”的按鈕，來調(diào)整他們的順序。5、 配置窗口的“菜單之后插入前往按鈕”一項(xiàng)先不要選擇。選中“更改URL后選擇第一個項(xiàng)目”一項(xiàng)，這樣當(dāng)使用跳轉(zhuǎn)菜單到某個頁面后，假如返回到跳轉(zhuǎn)菜單頁面，此時頁面中的跳轉(zhuǎn)菜單默認(rèn)顯示的依舊是第1項(xiàng)內(nèi)容。6、 配置完畢后點(diǎn)擊“確定”即可。*因?yàn)樘D(zhuǎn)菜單是個表單，所以其實(shí)是先插入了表單（紅色虛線區(qū)域），然后在表單中再插入了下拉菜單。7、 想修改選項(xiàng)，能夠選中頁面上的下攔菜單，此時點(diǎn)擊屬性面板中的“列表值”，即可修改各項(xiàng)內(nèi)容了。8、 當(dāng)選中跳轉(zhuǎn)菜單時，行為窗口中也出現(xiàn)行為。雙擊該行為，也能夠進(jìn)入配置窗口，能夠重新對其進(jìn)行配置。9、 假如“菜單項(xiàng)”里的第一項(xiàng)就是

25、鏈接，而不是上面所說的一句提示的話，那么就要選中“選項(xiàng)“中的“菜單之后插入前往按鈕”。添加一個“前往”按鈕。二十一、運(yùn)用插件（Dreamweaver功能擴(kuò)展）1、 首先下載好需要的插件，此處舉例用的是Animate Browser Window。這是個動態(tài)改變窗口的大小的插件。打開Dreamweaver Extension Manager，安裝下載好的插件。 2、 啟動Dreamweaver，在做好的頁面上，右擊左下角body，然后點(diǎn)擊行為窗口中的“ ”號按鈕，在其中選擇“Animate Browser Window”，然后在其中做相應(yīng)的配置。這里配置窗口打開之前高寬均為0，打開后為填滿屏幕。

26、觸發(fā)條件為onLoad。二十二、滾動字幕1、把光標(biāo)插入點(diǎn)放在需要插入滾動字幕的地方。2、點(diǎn)擊插入面板的“標(biāo)簽選擇器 ”。3、選擇 marquee標(biāo)簽，點(diǎn)擊“插入”按鈕。然后關(guān)閉“標(biāo)簽選擇器 ”。4、轉(zhuǎn)換到代碼視圖。把光標(biāo)插入點(diǎn)放在 兩個marquee標(biāo)簽之間。5、選擇“窗口”/“標(biāo)簽檢查器”。能夠在“標(biāo)簽檢查器”中配置標(biāo)簽的各種用法。6、點(diǎn)擊behavior配置項(xiàng)右邊的下拉箭頭，選擇滾動字幕內(nèi)容的運(yùn)動方式。其中三個選項(xiàng)意思分別是：Alternate：內(nèi)容在相反兩個方向滾來滾去。Scroll：內(nèi)容向同一個方向滾動。Slide：內(nèi)容接觸到字幕邊框就停止?jié)L動。7、direction屬性配置字幕內(nèi)容的

27、滾動方向。四個選項(xiàng)意思為：down：向下運(yùn)動。Left：向左運(yùn)動。Right：向右運(yùn)動。Up：向上運(yùn)動。8、scrollamount屬性配置字幕滾動的速度。一般設(shè)為1。9、scrolldelay屬性配置字幕內(nèi)容滾動時停頓的時間，單位為毫秒。假如要讓滾動看起來流暢，數(shù)值應(yīng)該盡量小。實(shí)例中配置為1毫秒。10、width屬性配置滾動字幕的寬度。這個任意，比如配置為300。11、onMouseOver事件配置鼠標(biāo)移動到滾動字幕時的動作，常配置為停止?jié)L動。onMouseOut事件配置鼠標(biāo)離開滾動字幕時的動作，常配置為開始滾動。這個兩項(xiàng)不能選，只能手工輸入。在onMouseOver后面輸入“this.st

28、op();” 在onMouseOut后面輸入“this.start();”12、style屬性配置字幕內(nèi)容的樣式。實(shí)例中配置字幕文字大小，也要手工輸入“font:12px;”。13、loop屬性配置字幕內(nèi)容滾動次數(shù)，默認(rèn)值為無限?！?1”也為無限。 14、全部代碼：滾動字幕內(nèi)容二十三、創(chuàng)建CSS樣式表1、在網(wǎng)頁上輸入一些文字。2、打開“CSS樣式”面板，也能夠用“窗口/CSS樣式”打開。3、面板下方有四個按鈕，分別是附加樣式、新建樣式、編輯樣式、刪除樣式。4、點(diǎn)擊“新建樣式”，打開對話框。輸入名稱，注意名稱前有一個點(diǎn)號。如取名為.zi(中文名不行)。類型：創(chuàng)建自定義樣式，定義在：僅對該文檔。5

29、、此時再打開一個對話框，在左邊的分類里選擇“類型”，然后在右面配置字體為宋體，大小為14像素，顏色任意。然后確定。6、選中頁面上的文字，然后點(diǎn)擊窗口里的樣式.zi。此時這段文字就應(yīng)用了CSS樣式。7、如要對剛才定義的CSS樣式進(jìn)行修改，能夠點(diǎn)中他，然后點(diǎn)下面的編輯樣式按鈕。二十四、創(chuàng)建動態(tài)鏈接樣式表1、點(diǎn)擊“新建CSS樣式”對話框，在“定義在”一欄選擇“僅對該文檔”，在“類型”一欄里選擇“使用CSS選擇器”。2、當(dāng)樣式表類型選擇“使用CSS選擇器”時，下拉菜單的名字變成了“選擇器”，表示輸入內(nèi)容為CSS選擇符，單擊下拉按鈕，能夠看到動態(tài)鏈接的4種狀態(tài)。a:link終極鏈接的正常狀態(tài)； a:vi

30、sited訪問過的終極鏈接狀態(tài)。a:hover光標(biāo)移至終極鏈接上時的狀態(tài)； a:active選中終極鏈接的狀態(tài)。3、 接下來對這幾種狀態(tài)分別設(shè)定，首先從下拉菜單中選擇a:link，點(diǎn)擊“確定”按鈕后彈出樣式表配置窗口，設(shè)定該樣式無下劃線，顏色為#FF6600（橙色）。4、 用同樣方法設(shè)定a:visited，設(shè)定其為無下劃線，顏色為#FFFF00（黃色）。5、 接下來設(shè)定a:hover，設(shè)定其為有劃線，顏色為#FF6600（橙色）。6、 a:active不用配置，他會自動依照a:hover而定。7、 在網(wǎng)頁上輸入一句話，在屬性面板中設(shè)定他的鏈接為“#”。即可。*注意：必須按照這樣a:link、

31、a:visited 、a:hover 、a:active的順序來配置，否則不會出現(xiàn)預(yù)期的效果。假如我們需要一個頁面上有兩個或更多的鏈接效果，能夠用以下方法：1、 點(diǎn)擊新建樣式按鈕，樣式類型選“使用CSS選擇器”，在“選擇器”一欄里，直接輸入a.link2:link，接著配置a.link2:link為紅色無下劃線。2、 繼續(xù)定義下面兩個樣式。名稱都直接輸入，分別設(shè)定他們?yōu)閍.link2:visited，紫色無下劃線。 a.link2:hover，藍(lán)色有下劃線。3、 此時在“CSS樣式”選項(xiàng)下多了一個名稱為link2的自定義樣式。4、 在頁面中輸入一段話，為他添加一個#鏈接，選中這個鏈接，然后點(diǎn)擊

32、樣式表窗口中的樣式link2，將此樣式應(yīng)用在該鏈接上。5、 同樣方法能夠制作同一頁面上的不同鏈接格式。*為保持一種風(fēng)格，同一頁面上不宜建立過多的鏈接樣式。二十五、外部樣式表*在不同的頁面中應(yīng)用相同的樣式表。1、 新建樣式表，取名，然后類型選“創(chuàng)建自定義樣式”，定義在選“新建樣式表文檔”。2、 確定后，打開保存外部樣式表的窗口。然后把他保存到本地站點(diǎn)中即可。3、 此時，能夠看到樣式表窗口中新增了一個樣式表文檔，文檔的后綴名為css4、 假如當(dāng)前頁面中的一個內(nèi)部樣式表要導(dǎo)出為外部樣式表文檔，以便供其他頁面使用，能夠點(diǎn)擊樣式表窗口右上角的灰色的圖標(biāo)，選“導(dǎo)出樣式表”，此時能夠?yàn)闃邮饺∶捅４鏋橐粋€外

33、部文檔。5、 當(dāng)其他頁面需要使用外部樣式表時，能夠點(diǎn)樣式表窗口中的第一個按鈕“附加樣式表”，打開窗口，然后選擇外部樣式表文檔，在添加為里選“鏈接”，確定即可。二十六、其他CSS*CSS里的背景，是配置文字背景、表格背景圖等。*CSS里的區(qū)塊，是指配置文本的文字間距、對齊方式、下標(biāo)、上標(biāo)、排列方式等。*CSS里的盒子，是指配置圖片和文本內(nèi)容之間的空白距離，連同圖文混排的方法。*CSS里的邊框，是指配置表格文本區(qū)、按鈕等的美化。*CSS里的列表，是指配置列表項(xiàng)樣式。即那種提綱式的一段話。*CSS里的定位，是指配置頁面中圖片的相對和絕對定位。*CSS里的擴(kuò)展，其中的光標(biāo)，能夠配置光標(biāo)的樣式，能夠配置

34、為hand（手型）、crosshair（十字型）、text（“I”型）、wait（等待型）、default（默認(rèn)型）、help（幫助型），更有各種方向的箭頭型。*CSS里的擴(kuò)展，其中的過濾器，能夠用來做CSS濾鏡特效，即用來加工圖片的透明、發(fā)光等。但效果不太明顯，還是用專門加工圖片的軟件來完成比較好。二十七、創(chuàng)建網(wǎng)上相冊1、 首先要安裝好FireworksMX軟件。2、 加工好所需要放在網(wǎng)上的照片，把他們加工成相同大小，放在一個文檔夾里。3、 點(diǎn)擊菜單中的命令/創(chuàng)建網(wǎng)站相冊，打開配置窗口。4、 輸入相冊標(biāo)題，副標(biāo)信息，其他信息（以后也可再修改）?！霸磮D像文檔夾”，選擇剛才保存照片的文檔夾。5、

35、 “目標(biāo)文檔夾”，單擊“瀏覽”按鈕選擇當(dāng)前站點(diǎn)目錄。（即將照片全部保存到站點(diǎn)里來）6、 “縮略圖大小”一項(xiàng)，能夠根據(jù)需要選擇，“顯示文檔名稱”一項(xiàng)，選中會在生成的相冊中顯示每個圖片的文檔名。7、 “列”一格是每一行顯示的圖片數(shù)，默認(rèn)為5，能夠自己改變。8、 下面兩個“格式”一般都選“品質(zhì)較高”。9、 選中“為每張圖片建立導(dǎo)覽頁面”一項(xiàng)。確定即可。二十八、定制網(wǎng)頁過渡功能*網(wǎng)頁過渡是指當(dāng)瀏覽者進(jìn)入或離開網(wǎng)頁時，頁面呈現(xiàn)的不同的刷新效果，比如卷動、百葉窗等。網(wǎng)頁看起來會更具備動感，但是也要注意適可而止，否則太花哨的變化也容易引起瀏覽者的反感。步驟：1、 打開一個頁面，單擊菜單中的插入/文檔頭標(biāo)簽/

36、Meta，會彈出Meta對話框。2、 在對話框中的屬性選項(xiàng)的下拉列表中選HTTP-equivalent選項(xiàng)，在值一格中鍵入Page-Enter，表示進(jìn)入網(wǎng)頁時有網(wǎng)頁過渡效果。3、在內(nèi)容一格中鍵入 Revealtrans(Duration=4,Transition=2),Duration=4 表示網(wǎng)頁過渡效果的延續(xù)時間為4秒，Transition表示過渡效果方式，值為2時表示圓形收縮。4、輸入完后單擊確定，存盤。這樣當(dāng)我們點(diǎn)擊一個超鏈接進(jìn)入這個頁面時就能夠看到效果了。5、另外更有二十多種效供您選擇，只要將Transition的值改為相應(yīng)的效果的代號即可，具體效果和配置如下表所示效果 Transi

37、tion 效果 Transition盒狀收縮 0 溶解 12盒狀展開 1 左右向中部收縮 13圓形收縮 2 中部向左右展開 14圓形展開 3 上下向中部收縮 15向上擦除 4 中部向上下展開 16向下擦除 5 階梯狀向左下展開 17向左擦除 6 階梯狀向左上展開 18向右擦除 7 階梯狀向右下展開 19垂直百葉窗 8 階梯狀向右上展開 20水平百葉窗 9 隨機(jī)水平線 21橫向棋盤式 10 隨機(jī)垂直線 22縱向棋盤式 11 隨機(jī) 23二十九、庫的應(yīng)用*網(wǎng)站中有些內(nèi)容需要反復(fù)使用，比如自己制作的一個網(wǎng)站圖標(biāo)等，此時將這個組件存為在庫里，能夠隨時調(diào)用。1、 打開一個頁面，選擇需要保存的組件，比如一個

38、圖標(biāo)。2、 點(diǎn)擊菜單窗口/資源，打開資源窗口。然后在其中選最下面一本書樣的按鈕，打開庫面板。3、 點(diǎn)擊下面的新建按鈕，就將剛才選中的圖標(biāo)保存到庫里了，此時還能夠給他取名。4、 在一個新頁面上要應(yīng)用庫里的內(nèi)容時，打開庫面板，選中需要用的圖標(biāo)，然后點(diǎn)擊下面的“插入”即可。三十、用模板迅速完成站點(diǎn)（首頁或內(nèi)部某一頁）1、 首先規(guī)劃好自己想要制作的網(wǎng)站，要把他的各項(xiàng)鏈接的內(nèi)容都設(shè)計(jì)好。如我的網(wǎng)站：首頁上的鏈接有：網(wǎng)頁版、動畫版、請留言、關(guān)于我、聯(lián)系我、許愿瓶網(wǎng)頁版上的鏈接有：站長簡介| |教研論文| |課堂尋真| |原創(chuàng)課件| |心海擷貝| |留影人生| |給我來信| |雁過留聲|動畫版上的鏈接和網(wǎng)頁版相同。以下再鏈接到各種文章或課件的頁面。如“課堂尋真”鏈接到全是教案標(biāo)題的頁面，然后由每一個教案標(biāo)題，再鏈接到放這個教案的頁面。其他同理。2、下載好比較適合自己規(guī)劃的、所喜歡的網(wǎng)頁模板，（模板網(wǎng)站比較好的如： ）一般他都包括兩個文檔：一個是index.htm，另一個一般是命名為images的文檔夾，即我們所說的用來放置圖片的。3、 定義好站點(diǎn)，然后將這兩個文檔（夾）復(fù)