




版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進行舉報或認領(lǐng)
文檔簡介
1、Dreamweaver8圖文教程一、Dreamweaver8 的操作環(huán)境在首次啟動Dreamweaver8時會出現(xiàn)一個“工作區(qū)設(shè)置”對話框,在對話框左側(cè)是Dreamweaver8的設(shè)計視圖,右側(cè)是Dreamweave 8的代碼視圖。Dreamweaver8設(shè)計視圖布局提供了一個將全部元素置于一個窗口中的集成布局。我們選擇面向設(shè)計者的設(shè)計視圖布局。在Dreamweave 8 中首先將顯示一個起始頁,可以勾選這個窗口下面的“不在顯示此對話框”來隱藏它。在這個頁面中包括“打開最近項目”、“創(chuàng)建新項目”“從范例創(chuàng)建”3個方便實用的項目,建議大家保留。新建或打開一個文檔,進入Dreamweaver8的標(biāo)
2、準工作界面。Dreamweaver8的標(biāo)準工作界面包括:標(biāo)題顯示、菜單欄、插入面板組、文檔工具欄、標(biāo)準工具欄、文檔窗口、狀態(tài)欄、屬性面板和浮動面板組。1、標(biāo)題顯示欄 啟動Macromedia Dreamweave 8后,標(biāo)題欄將顯示文字Macromedia Dreamweave 8.0,新建或打開一個文檔后,在后面還會顯示該文檔所在的位置和文件名稱。2、菜單欄Dreamweave 8的菜單共有10個,即文件、編輯、視圖、插入、修改、文本、命令、站點、窗口和幫助。其中,編輯菜單里提供了對Dreamweaver菜單中首選參數(shù)的訪問。文件:用來管理文件。例如新建,打開,保存,另存為,導(dǎo)入,輸出打印等
3、。編輯:用來編輯文本。例如剪切,復(fù)制,粘貼,查找,替換和參數(shù)設(shè)置等。查看:用來切換視圖模式以及顯示、隱藏標(biāo)尺、網(wǎng)格線等輔助視圖功能。插入:用來插入各種元素,例如圖片、多媒體組件,表格、框架及超級鏈接等。修改:具有對頁面元素修改的功能,例如在表格中插入表格,拆分、合并單元格,對其對象等。文本:用來對文本操作,例如設(shè)置文本格式等。命令:所有的附加命令項推薦精選站點:用來創(chuàng)建和管理站點窗口:用來顯示和隱藏控制面板以及切換文檔窗口幫助:聯(lián)機幫助功能。例如按下F1鍵,就會打開電子幫助文本3、插入面板組 插入面板集成了所有可以在網(wǎng)頁應(yīng)用的對象包括“插入”菜單中的選項。插入面板組其實就是圖像化了的插入指令,
4、通過一個個的按鈕,可以很容易的加入圖像、聲音、多媒體動畫、表格。圖層、框架、表單、Flash和ActiveX等網(wǎng)頁元素。4、文檔工具欄“文檔”工具欄包含各種按鈕,它們提供各種“文檔”窗口視圖(如“設(shè)計”視圖和“代碼”視圖)的選項、各種查看選項和一些常用操作(如在瀏覽器中預(yù)覽)。5、標(biāo)準工具欄“標(biāo)準”工具欄包含來自“文件”和“編輯”菜單中的一般操作的按鈕:“新建”、“打開”、“保存”、“保存全部”、“剪切”、“復(fù)制”、“粘貼”、“撤消”和“重做”。6、文檔窗口當(dāng)我們打開或創(chuàng)建一個項目,進入文檔窗口,我們可以在文檔區(qū)域中進行輸入文字、插入表格和編輯圖片等操作?!拔臋n”窗口顯示當(dāng)前文檔??梢赃x擇下列
5、任一視圖:“設(shè)計”視圖是一個用于可視化頁面布局、可視化編輯和快速應(yīng)用程序開發(fā)的設(shè)計環(huán)境。在該視圖中,Dreamweaver 顯示文檔的完全可編輯的可視化表示形式,類似于在瀏覽器中查看頁面時看到的內(nèi)容?!按a”視圖是一個用于編寫和編輯 HTML、JavaScript、服務(wù)器語言代碼以及任何其他類型代碼的手工編碼環(huán)境?!按a和設(shè)計”視圖使您可以在單個窗口中同時看到同一文檔的“代碼”視圖和“設(shè)計”視圖。7、狀態(tài)欄“文檔”窗口底部的狀態(tài)欄提供與你正創(chuàng)建的文檔有關(guān)的其它信息。標(biāo)簽選擇器顯示環(huán)繞當(dāng)前選定內(nèi)容的標(biāo)簽的層次結(jié)構(gòu)。單擊該層次結(jié)構(gòu)中的任何標(biāo)簽以選擇該標(biāo)簽及其全部內(nèi)容。單擊 <body>
6、 可以選擇文檔的整個正文。8、屬性面板屬性面板并不是將所有的屬性加載在面板上,而是根據(jù)我們選擇的對象來動態(tài)顯示對象的屬性屬性面板的狀態(tài)完全是隨當(dāng)前在文檔中選擇的對象來確定的。例如,當(dāng)前選擇了一幅圖像,那么屬性面板上就出現(xiàn)該圖像的相關(guān)屬性;如果選擇了表格,那么屬性面板會相應(yīng)的變化成表格的相關(guān)屬性。推薦精選9、浮動面板其它面板可以同稱為浮動面板,這些面板都浮動于編輯窗口之外。在初次使用Dreamweave 8的時候,這些面板根據(jù)功能被分成了若干組。在窗口菜單中,選擇不同的命令可以打開基本面板組、設(shè)計面板組、代碼面板組、應(yīng)用程序面板組、資源面板組和其它面板組。終于把Dreamweave 8的基本工作
7、界面介紹完了,你是否已經(jīng)了解它?從現(xiàn)在開始,讓我們一起來建造一座小房子。二、站點管理 要制作一個能夠被大家瀏覽的網(wǎng)站,首先需要在本地磁盤上制作這個網(wǎng)站,然后把這個網(wǎng)站傳到互聯(lián)網(wǎng)的web服務(wù)器上。放置在本地磁盤上的網(wǎng)站被稱為本地站點,位于互聯(lián)網(wǎng)web服務(wù)器里的網(wǎng)站被稱為遠程站點。Dreamweaver 8提供了對本地站點和遠程站點強大的管理功能。 1、規(guī)劃站點結(jié)構(gòu) 網(wǎng)站是多個網(wǎng)頁的集合,其包括一個首頁和若干個分頁,這種集合不是簡單的集合。為了達到最佳效果,在創(chuàng)建任何 Web 站點頁面之前,要對站點的結(jié)構(gòu)進行設(shè)計和規(guī)劃。決定要創(chuàng)建多少頁,每頁上顯示什么內(nèi)容,頁面布局的外觀以及各頁是如何互相連接起來
8、的。我們可以通過把文件分門別類的放置在各自的文件夾里,使網(wǎng)站的結(jié)構(gòu)清晰明了,便于管理和查找。2、創(chuàng)建站點在Dreamweave 8中可以有效的建立并管理多個站點。搭建站點可以有兩種方法,一是利用向?qū)瓿?,二是利用高級設(shè)定來完成。在搭建站點前,我們先在自己的電腦硬盤上建一個以英文或數(shù)字命名的空文件夾。 (1)選擇菜單欄站點管理站點,出現(xiàn)“管 理站點”對話框。點擊“新建”按鈕,選擇彈出菜單中的“站點”項。 在打開的窗口上方有“基本”和“高級”兩個標(biāo)簽,可以在站點向?qū)Ш透呒壴O(shè)置之間切換。下面選擇“基本”標(biāo)簽。推薦精選在文本框中,輸入一個站點名字以在 Dreamweaver8.0中標(biāo)識該站點。這個名字
9、可以是任何你需要的名字。單擊“下一步”。出現(xiàn)向?qū)У南乱粋€界面,詢問是否要使用服務(wù)器技術(shù)。我們現(xiàn)在建立的是一個靜態(tài)頁面,所以選擇“否”。推薦精選點下一步,在文檔框設(shè)置本地站點文件夾的地址。點下一步,進入站點定義,我們將在站點建設(shè)完成后在與FTP鏈接,這里選擇“無”。單擊“完成”按鈕,結(jié)束“站點定義“對話框的設(shè)置。推薦精選單擊“完成”按鈕,文件面板顯示出剛才建立的站點。到此,我們完成了站點的創(chuàng)建。3、搭建站點結(jié)構(gòu)站點是文件與文件夾的集合,下面我們根據(jù)前面對xmweb網(wǎng)站的設(shè)計,來新建xmweb站點要設(shè)置的文件夾和文件。新建文件夾,在文件面板的站點跟目錄下單擊鼠標(biāo)右鍵,從彈出菜單中選擇“新建文件夾”
10、項,然后給文件夾命名。這里我們創(chuàng)建新建8個文件夾,分別命名為:img、med、swf、txt、css、js、moan和fy。創(chuàng)建頁面,在文件面板的站點跟目錄下單擊鼠標(biāo)右鍵,從彈出菜單中選擇“新建文件”項,然后給文件命名。首先要添加首頁,我們把首頁命名為index.html,再分別新建01.html、02.html、03.html、04.html和05.html。推薦精選4、文件與文件夾的管理對建立的文件和文件夾,可以進行移動、復(fù)制、重命名和刪除等基本的管理操作。單擊鼠標(biāo)左鍵選中需要管理的文件或文件夾,然后單擊鼠標(biāo)右鍵,再彈出菜單中選“編輯”項,即可進行相關(guān)操作。三、在網(wǎng)頁中使用圖文 我們已經(jīng)描
11、繪了小屋的藍圖,從現(xiàn)在開始,為我們的小屋添磚加瓦吧。打開01.html,制作一個圖文混排的簡單頁面。(一)、頁面的總體設(shè)置 1、設(shè)置頁面的頭內(nèi)容 頭內(nèi)容再瀏覽器中是不可見的,但是卻攜帶著網(wǎng)頁的重要信息,如關(guān)鍵字、描述文字等,還可以實現(xiàn)一些非常重要的功能,如自動刷新功能。 鼠標(biāo)左鍵單擊插入工具欄最左邊按鈕旁的下拉小三角,在彈出菜單中選擇“HTML”項,出現(xiàn)“文件頭”按鈕,點開下拉菜單,就可以進行頭內(nèi)容的設(shè)置了。 設(shè)置標(biāo)題,網(wǎng)頁標(biāo)題可以是中文、英文或符號,顯示在瀏覽器的標(biāo)題欄中。我們直接在設(shè)計窗口上方的標(biāo)題欄內(nèi)輸入或更改,就可以完成網(wǎng)頁標(biāo)題的編輯了。插入關(guān)鍵字,關(guān)鍵字用來協(xié)助網(wǎng)絡(luò)上的搜索引擎尋找網(wǎng)
12、頁。要想讓更多的人看見你的網(wǎng)站,這項要好好填哦_單擊上圖所示的“關(guān)鍵字”項,彈出“關(guān)鍵字”對話框,填入關(guān)鍵字即可。推薦精選插入META,META標(biāo)記用于記錄當(dāng)前網(wǎng)頁的相關(guān)信息,如編碼,作者,版權(quán)等,也可以用來給服務(wù)器提供信息。單擊上圖所示的“META”項,彈出“META”對話框,在“屬性”欄選擇“名稱”屬性,在“值”文本框中輸入相應(yīng)的值,可以定義相應(yīng)的信息。author作者信息,copyright版權(quán)聲明,generator網(wǎng)頁編輯器。2、設(shè)置頁面屬性單擊“屬性欄”中的“頁面屬性”按鈕,打開的“頁面屬性”對話框。設(shè)置外觀,“外觀”是設(shè)置頁面的一些基本屬性。我們可以定義頁面中的默認文本字體、文本
13、字號、文本顏色、背景顏色和背景圖像等。我們設(shè)置頁面的所有邊距為0。設(shè)置鏈接,“鏈接”選項內(nèi)是一些與頁面的鏈接效果有關(guān)的設(shè)置。“鏈接顏色”定義超鏈接文本默認狀態(tài)下的字體顏色,“變換圖像鏈接”定義鼠標(biāo)放在鏈接上時文本的顏色,“已訪問鏈接”定義訪問過的鏈接的顏色,“活動鏈接”定義活動鏈接的顏色?!跋聞澗€樣式”可以定義鏈接的下劃線樣式。推薦精選設(shè)置標(biāo)題,“標(biāo)題”用來設(shè)置標(biāo)題字體的一些屬性。如下圖所示,在左側(cè)“分類”列表中選擇“標(biāo)題”,這里的標(biāo)題指的并不是頁面的標(biāo)題內(nèi)容,而是可以應(yīng)用在具體文章中各級不同標(biāo)題上的一種標(biāo)題字體樣式。我們可以定義“標(biāo)題字體”及6種預(yù)定義的標(biāo)題字體樣式,包括粗體、斜體、大小和顏
14、色。按自己的喜歡的風(fēng)格設(shè)置吧。(二)、Dreamweaver 8 文本的插入與編輯1、插入文本 要向 Dreamweaver 文檔添加文本,可以直接在Dreamweaver“文檔”窗口中鍵入文本,也可以剪切并粘貼,還可以從word文檔導(dǎo)入文本。 用鼠標(biāo)在文檔編輯窗口的空白區(qū)域點一下,窗口中出現(xiàn)閃動的光標(biāo),提示文字的起始位置,將01.rar中的文字素材復(fù)制/粘貼進來。 2、編輯文本格式 網(wǎng)頁的文本分為段落和標(biāo)題兩種格式。 在文檔編輯窗口中選中一段文本,在屬性面板“格式”后的下拉列表框中選擇“段落”把選中的文本設(shè)置成段落格式。 “標(biāo)題1”到“標(biāo)題6”分別表示各級標(biāo)題,應(yīng)用于網(wǎng)頁的標(biāo)題部分。對應(yīng)的字
15、體由大到小,同時文字全部加粗。 另外,在屬性面板中可以定義文字的字號、顏色、加粗、加斜、水平對齊等內(nèi)容。 3、設(shè)置字體組合 Dreamweaver8預(yù)設(shè)讀的可供選擇的字體組合只有6項英文字體組合,要想使用中文字體,必須重新編輯新的字體組合,在“字體”后的下拉列表框中選擇“編輯字體列表”,彈出推薦精選“編輯字體列表”對話框: 4、文字的其它設(shè)置 文本換行,按Enter鍵換行的行距較大(在代碼區(qū)生成<p></p>標(biāo)簽),按EnterShift鍵換行的行間距較?。ㄔ诖a區(qū)生成<br>標(biāo)簽)。 文本空格,我們選擇編輯/首選參數(shù),在彈出得對話框中左側(cè)的分類列表中選擇“
16、常規(guī)”項,然后在右邊選“允許多個連續(xù)的空格”項,我們就可以直接按“空格”鍵給文本添加空格了。特殊字符,要向網(wǎng)頁中插入特殊字符,需要在快捷工具欄選擇“文本”,切換到字符插入欄,單擊文本插入欄的最后一個按鈕,可以向網(wǎng)頁中插入相應(yīng)的特殊符號。推薦精選插入列表,列表分為兩種,有序列表和無序列表,無序列表沒有順序,每一項前邊都以同樣的符號顯示,有序列表前邊的每一項有序號引導(dǎo)。在文檔編輯窗口中選中需要設(shè)置的文本,在屬性面板中單擊,則選中的文本被設(shè)置成無序列表,單擊則被設(shè)置成有序列表。插入水平線,水平線起到分隔文本的排版作用,選擇快捷工具欄的“HTML”項,單擊HTML欄的第一個按鈕,即可向網(wǎng)頁中插入水平線
17、。選中插入的這條水平線,可以在屬性面板對它的屬性進行設(shè)置。 插入時間,在文檔編輯窗口中,將鼠標(biāo)光標(biāo)移動到要插入日期的位置,單擊常用插入欄的“日期”按鈕,在彈出的“插入日期”對話框中選擇相應(yīng)的格式即可。(三)、Dreamweaver 8 插入圖像 目前互聯(lián)網(wǎng)上支持的圖像格式主要有GIF、JPEG和PNG。其中使用最為廣泛的是GIF和JPEG。1、插入圖像在制作網(wǎng)頁時,先構(gòu)想好網(wǎng)頁布局,在圖像處理軟件中將需要插入的圖片進行處理,然后存放在站點根目錄下的文件夾里。插圖圖像時,將光標(biāo)放置在文檔窗口需要插入圖像的位置,然后鼠標(biāo)單擊常用插入欄的“圖像”按鈕。 彈出的“選擇圖像源文件”對話框,選擇img/0
18、01.jpg,單擊“確定”按鈕就把圖像001.jpg插入到了網(wǎng)頁中。推薦精選注意:如果我們在插入圖片的時候,沒有將圖片保存在站點根目錄下,會彈出下圖所示的對話框,提醒我們要把圖片保存在站點內(nèi)部,這時單擊“是”按鈕,然后選擇本地站點的路徑將圖片保存,圖像也可以被插入到網(wǎng)頁中。2、設(shè)置圖像屬性選中圖像后,在屬性面板中顯示出了圖像的屬性,如下如所示。推薦精選在屬性面板的左上角,顯示當(dāng)前圖像的縮略圖,同時顯示圖像的大小。在縮略圖右側(cè)有一個文本框,在其中可以輸入圖像標(biāo)記的名稱。 圖像的大小是可以改變的,但是在DW里更改是極不好的習(xí)慣,如果我們的電腦安裝了FW軟件,單擊屬性面板的“編輯”旁邊的,即可啟動F
19、W對圖像進行縮放等處理。當(dāng)圖像的大小改變時,屬性欄中“寬”和“高”的數(shù)值會以粗體顯示,并在旁邊出現(xiàn)一個弧形箭頭,單擊它可以恢復(fù)圖像的原始大小。 “水平邊距”和“垂直邊距”文本框用來設(shè)置圖像左右和上下與其它頁面元素的距離。 “邊框”文本框時用來設(shè)置圖像邊框的寬度,默認的邊框?qū)挾葹?。 “替代”文本框用來設(shè)置圖像的替代文本,可以輸入一段文字,當(dāng)圖像無法顯示時,將顯示這段文字。 單擊屬性面板中的對齊按鈕,可以分別將圖像設(shè)置成瀏覽器居左對齊、居中對齊、居右對齊。 在屬性面板中,“對齊”下拉列表框時設(shè)置圖像與文本的相互對齊方式,共有10個選項。通過它我們可以將文字對齊到圖像的上端、下端、左邊和右邊等,從
20、而可以靈活的實現(xiàn)文字與圖片的混排效果。 3、插入其它圖像元素 在我們單擊常用插入欄的“圖像”按鈕時,可以看到,除了第1項“圖像”外,還有“圖像占位符”、“鼠標(biāo)經(jīng)過圖像”、“導(dǎo)航條”等項目。 插入圖像占位符,在我們布局頁面時,如果要在網(wǎng)頁中插入一張圖片,可以先不制作圖片,而是使用占位符來代替圖片位置。單擊下拉列表中的“圖像占位符”,打開“圖像占位符”對話框。按設(shè)計需要設(shè)置圖片的寬度和高度,輸入呆插入圖像的名稱,即可。鼠標(biāo)經(jīng)過圖像,鼠標(biāo)經(jīng)過圖像實際上由兩個圖像組成,主圖像(當(dāng)首次載入頁時顯示的圖像)和次圖像(當(dāng)鼠標(biāo)指針移過主圖像時顯示的圖像)。這兩張圖片要大小相等,如果不相等,DW自動調(diào)整次圖片的
21、大小跟主圖像大小一致。推薦精選 圖片與文本一樣,是網(wǎng)頁中最常用到的內(nèi)容,其變化相對較少,要想排出精致美觀的網(wǎng)頁,下一節(jié)課的內(nèi)容可是必不可少的哦,繼續(xù)努力吧_四、Dreamweaver 8 插入表格 表格是網(wǎng)頁設(shè)計制作不可缺少的元素,它以簡潔明了和高效快捷的方式將圖片、文本、數(shù)據(jù)和表單的元素有序的顯示在頁面上,讓我們可以設(shè)計出漂亮的頁面,使用表格排版的頁面在不同平臺、不同分辨率的瀏覽器里都能保持其原有的布局,而在不同的瀏覽器平臺有較好的兼容性,所以表格是網(wǎng)頁中最常用的排版方式之一。(一)、插入并編輯表格 1、插入表格在文檔窗口中,將光標(biāo)放在需要創(chuàng)建表格的位置,單擊“常用”快捷欄中的表格按鈕彈出的
22、“表格”對話框,指定表格的屬性后,在文檔窗口中插入設(shè)置的表格。 “行數(shù)”文本框用來設(shè)置表格的行數(shù)?!傲袛?shù)”文本框用來設(shè)置表格的列數(shù)。推薦精選“表格寬度”文本框用來設(shè)置表格的寬度,可以填入數(shù)值,緊隨其后的下拉列表框用來設(shè)置寬度的單位,有兩個選項百分比和像素。當(dāng)寬度的單位選擇百分比時,表格的寬度會隨瀏覽器窗口的大小而改變。 “單元格邊距”文本框用來設(shè)置單元格的內(nèi)部空白的大小。 “單元格間距”文本框用來設(shè)置單元格與單元格之間的距離。 “邊框粗細”用來設(shè)置表格的邊框的寬度?!绊撁肌倍x頁眉樣式,可以在四種樣式中選擇一種。 “標(biāo)題” 定義表格的標(biāo)題。 “對其標(biāo)題”定義表格標(biāo)題的對齊方式。 “摘要” 可以
23、在這里對表格進行注釋。2、選擇單元格對象對于表格、行、列、單元格屬性的設(shè)置是以選擇這些對象為前提的。選擇整個表格的方法是把鼠標(biāo)放在表格邊框的任意處,當(dāng)出現(xiàn)這樣的標(biāo)志時單擊即可選中整個表格,或在表格內(nèi)任意處單擊,然后在狀態(tài)欄選中<table>標(biāo)簽即可;或在單元格任意處單擊,點鼠標(biāo)右鍵在彈出菜單菜單中選擇“表格選擇表格”要選中某一單元格,按住Ctrl鍵,鼠標(biāo)在需要選中的單元格單擊即可;或者,選中狀態(tài)欄中的<td>標(biāo)簽。要選中連續(xù)的單元格,按住鼠標(biāo)左鍵從一個單元格的左上方開始向要連續(xù)選擇單元格的方向拖動。要選中不連續(xù)的幾個單元格,可以按住Ctrl鍵,單擊要選擇的所有單元格即可
24、。要選擇某一行或某一列,將光標(biāo)移動到行左側(cè)或列上方,鼠標(biāo)指針變?yōu)橄蛴一蛳蛳碌募^圖標(biāo)時,單擊即可。3、設(shè)置表格屬性選中一個表格后,可以通過屬性面板更改表格屬性。推薦精選“填充”文本框用來設(shè)置單元格邊距,“間距”文本框用來設(shè)置單元格間距?!皩R”下拉列表框用來設(shè)置表格的對齊方式,默認的對齊方式一般為左對齊?!斑吙颉蔽谋究蛴脕碓O(shè)置表格邊框的寬度?!氨尘邦伾蔽谋究蛴脕碓O(shè)置表格的背景顏色?!斑吙蝾伾庇脕碓O(shè)置表格邊框的顏色。 在“背景圖像”文本框填入表格背景圖像的路徑,可以給表格添加背景圖像。也可以如下圖所示給文本框加上鏈接路徑。還可以單擊文本框后的“瀏覽”按鈕,查找圖像文件。在“選擇圖像源”對話框
25、中定位并選擇要設(shè)置為背景的圖片,單擊“確認”按鈕即可。4、單元格屬性把光標(biāo)移動到某個單元格內(nèi),可以利用單元格屬性面板對這個單元格的屬性進行設(shè)置?!八健蔽谋究蛴脕碓O(shè)置單元格內(nèi)元素的水平排版方式,是居左、居右或是居中?!按怪薄蔽谋究蛴脕碓O(shè)置單元格內(nèi)的垂直排版方式,是頂端對齊、底端對齊或是居中對齊?!案摺?、“寬”文本框用來設(shè)置單元格的寬度和高度?!安粨Q行”復(fù)選框可以防止單元格中較長的文本自動換行?!皹?biāo)題”復(fù)選框使選擇的單元格成為標(biāo)題單元格,單元格內(nèi)的文字自動以標(biāo)題格式顯示出來?!氨尘啊蔽谋究蛴脕碓O(shè)置表格的背景圖像。“背景顏色”文本框用來設(shè)置表格的背景顏色?!斑吙颉蔽谋究蛴脕砩O(shè)置表格邊框的顏色。5
26、、表格的行和列選中要插入行或列的單元格,單擊鼠標(biāo)右鍵,在彈出菜單中選擇“插入行”或“插入列”或“插入行或列”命令。推薦精選如果選擇了“插入行”命令,在選擇行的上方就插入了一個空白行,如果選擇了“插入列”命令,就在選擇列的左側(cè)插入了一列空白列。如果選擇了“插入行或列”命令,會彈出“插入行或列”對話框,可以設(shè)置插入行還是列、插入的數(shù)量,以及使在當(dāng)前選擇的單元格的上方或下方、左側(cè)或是右側(cè)插入行或列。要刪除行或列,選擇要刪除的行或列,單擊鼠標(biāo)右鍵,在彈出菜單中選擇“刪除行”或“刪除列”命令即可。6、拆分與合并單元格拆分單元格時,將光標(biāo)放在待拆分的單元格內(nèi),單擊屬性面板上的“拆分”按鈕,在彈出對話框中,
27、按需要設(shè)置即可。合并單元格時,選中要合并的單元格,單擊屬性面板中的“合并”按鈕即可。(二)、Dreamweaver 8 嵌套表格表格之中還有表格即嵌套表格。網(wǎng)頁的排版有時會很復(fù)雜,在外部需要一個表格來控制總體布局,如果內(nèi)部排版的細節(jié)也通過總表格來實現(xiàn),容易引起行高列寬等的沖突,給表格的制作帶來困難。其次,瀏覽器在解析網(wǎng)頁的時候,是將整個網(wǎng)頁的結(jié)構(gòu)下載完畢之后才顯示表格,如果不使用嵌套,表格非常復(fù)雜,瀏覽者要等待很長時間才能看到網(wǎng)頁內(nèi)容。引入嵌套表格,由總表格負責(zé)整體排版,由嵌套的表格負責(zé)各個子欄目的排版,并插入到總表格的相應(yīng)位置中,各司其職,互不沖突。另外,通過嵌套表格,利用表格的背景圖像、邊
28、框、單元格間距和單元格邊距等屬性可以得到漂亮的邊框效果,制作出精美的音畫貼圖網(wǎng)頁。推薦精選創(chuàng)建嵌套表格的操作方法,先插入總表格,然后將光標(biāo)置于要插入嵌套表格的地方,繼續(xù)插入表格即可。1、將光標(biāo)放置在文檔窗口要插入表格的位置,單擊常用插入欄“表格”按鈕,插入一個1行1列的表格一,寬度500像素,高度100,邊框為0,單元格間距為0,單元格邊距為12像素。背景圖像選擇beij/003.gif。2、將光標(biāo)放置在表格一內(nèi),插入表格二,1行1列,寬度100,高度100,邊框為0,單元格間距為0,單元格邊距為12像素。背景圖像選擇beij/002.gif。3、將光標(biāo)放置在表格二內(nèi),插入表格二,1行1列,寬
29、度100,高度100,單元格間距和單元格邊距都為8像素,邊框為10,邊框顏色為#FEE4ED。背景圖像選擇beij/005.gif。4、將光標(biāo)放置在表格三內(nèi),選擇單元格的背景圖像為beij/006.gif。添加文字“恭賀新禧”,字號68px,字體為隸書,顏色為#A51008。 (三)、表格的格式化做好的表格可以使用DW提供的預(yù)設(shè)外觀,可以提高制作效率,保持表格外觀的同一性,同時樣式提供的色彩搭配也比較美觀。插入一個5行6列的表格,表格的寬為500像素,高為300像素,邊框、單元格間距和邊距全為0 。選擇表格,居中對齊表格后,執(zhí)行命令/格式化表格,彈出“格式化表格”對話框,我們選擇AltRows
30、 red格式,單擊“確定”表格的樣式就設(shè)定好了。推薦精選m 這里,還可以自己設(shè)定相應(yīng)的參數(shù)值。五、Dreamweaver 8 插入Flash動畫不過,一個優(yōu)秀的網(wǎng)站應(yīng)該不僅僅是由文字和圖片組成的,而是動態(tài)的、多媒體。為了增強網(wǎng)頁的表現(xiàn)力,豐富文檔的顯示效果,我們可以向其Flash動畫、Java小程序、音頻播放插件等多媒體內(nèi)容。(一)、插入Flash動畫1、插入Flash為了合理的安排這一課的頁面元素,在插入Flash動畫之前,讓我們先來復(fù)習(xí)一下表格布局吧_打開03.html,設(shè)置頁面屬性,在彈出的“頁面屬性”對話框中,“外觀”項設(shè)置字體為“宋體”,字號為16px,文本顏色為#F282A8,背景
31、圖像為img/008.JPG,上邊距為50px、下、左、右的邊距都為0。 “鏈接”項選擇始終無下劃線,鏈接顏色為#F282A8,已訪問鏈接為#F5E458。 現(xiàn)在我們開始布局_(1)插入一個1行1列的表格(表格1),表格的寬度為726px,邊框粗細為0,單元格邊距為0、單元格間距為1,背景顏色為#892321,將表格居中對齊。推薦精選(2) 插入一個3行2列的表格(表格2),表格的寬度為100,邊框粗細為0,單元格邊距和單元格間距都為0,背景顏色#6DCFF6。設(shè)置第一行左邊單元格的寬為173px,高為137px,設(shè)置第二行的高為238px,將第三行的兩個單元格合并,高度為50px。在第一行左
32、側(cè)單元格插入圖片img/102.gif,在右側(cè)單元格插入圖片img/101.jpg。在第三行將光標(biāo)水平居中,輸入文字“版權(quán)所有©閃客啟航”(3)在表格2第二行左側(cè)單元格插入一個6行一列的表格(表格3),表格寬度為95,邊框和單元格邊距為0,單元格間距為5,將表格居中對齊。第一行高度為15,其余各行高度都為40。 (4) 在表格2右側(cè)單元格插入一個1行2列的表格(表格4),表格寬度為550px。邊框、單元格邊距和間距都為0。好啦我們完成了頁面的布局,開始插入頁面元素。將光標(biāo)放置在表格4右側(cè)單元格中,單擊常用快捷欄中的媒體按鈕,然后在彈出的列表中選擇Flash。彈出“選擇文件”對話框,選
33、擇swf文件夾中的huaduo.swf文件。單擊“確定”按鈕后,插入的Flash動畫并不會在文檔窗口中顯示內(nèi)容,而是以一個帶有字母F的灰色框來表示。在文檔窗口單擊這個Flash文件,就可以在屬性面板中設(shè)置它的屬性了。勾選“循環(huán)”復(fù)選框時影片將連續(xù)播放,否則影片在播放一次后自動停止。通過勾選“自動播放”復(fù)選框后,可以設(shè)定Flash文件是否在頁面加載時就播放。在“品質(zhì)”下拉列表中可以選擇Flash影片的畫質(zhì),以最佳狀態(tài)顯示,就選擇“高品質(zhì)”?!皩R”下拉列表用來設(shè)置Flash動畫的對齊方式,為了使頁面的背景在Flash下能夠襯托出來,我們可以使Flash的背景變?yōu)橥该?。單擊屬性面板中的推薦精選“參
34、數(shù)”按鈕,打開“參數(shù)”對話框,設(shè)置參數(shù)為wmode,值為transparent。這樣在任何背景下,F(xiàn)lash動畫都能實現(xiàn)透明背景的顯示。2、插入Flash文本 我們將光標(biāo)放置在表格3第二行的單元格中,用Flash文本制作導(dǎo)航欄目。單擊常用快捷欄的媒體按鈕,在列表中選擇Flash文本,彈出“插入Flash文本”對話框,字體隨意,大小22px,顏色設(shè)置為#F5E458,轉(zhuǎn)滾顏色為#54C994,文本為“圖片素材”,背景顏色#6DCFF6,選擇自己需要的路徑鏈接。同樣方法我們分別在表格3的第3、4、5、6行制作“代碼素材”、“Flash動漫”、“精美壁紙”和“音頻視頻”等欄目。3、插入Flash按鈕
35、我們在將光標(biāo)放置于插入Flash按鈕的位置,單擊常用快捷欄的媒體按鈕,在列表中選擇Flash按鈕,彈出“插入Flash按鈕”對話框?!皹邮健庇脕磉x擇按鈕的外觀,“按鈕文本”用來輸入按鈕上的文字,“字體”和“大小”用于設(shè)置按鈕上文字的字體和大小,字號變大,按鈕并不會跟著改變?!版溄印庇糜谳斎氚粹o的鏈接,可以是外部鏈接,也可以是內(nèi)部鏈接?!澳繕?biāo)”用來設(shè)置打開的鏈接窗口。 如果需要修改Flash按鈕對象,可以先選中它,然后在屬性面板中單擊“編輯”按鈕,會自動彈出剛才的“插入Flash按鈕”對話框,更改它的設(shè)置就可以了。推薦精選4、插入FlashPaper我們還可以在網(wǎng)頁中插入 Macromedia
36、FlashPaper 文檔。在瀏覽器中打開包含 FlashPaper 文檔的頁面時,瀏覽者能夠瀏覽 FlashPaper 文檔中的所有頁面,而無需加載新的 Web 頁。也可以搜索、打印和縮放該文檔。 在“文檔”窗口中,將光標(biāo)放放在頁面上想要顯示 FlashPaper 文檔的位置,然后選擇“插入”>“媒體”>“FlashPaper”。 在“插入 FlashPaper”對話框中,瀏覽到一個 FlashPaper 文檔并將其選定。如果需要,通過輸入寬度和高度(以像素為單位)指定 FlashPaper 對象在網(wǎng)頁上的尺寸。 FlashPaper 將縮放文檔以適合寬度。單擊“確定”在頁面中插
37、入文檔。 由于 FlashPaper 文檔是 Flash 對象,因此頁面上將出現(xiàn)一個 Flash 占位符。如果需要,在屬性檢查器中設(shè)置其他屬性。 5、插入Flash視頻請參見玉樹老師的教程(在上面的FlashPaper文檔中)。 (二)、Dreamweaver 8 插入聲音聲音能極好的烘托網(wǎng)頁頁面的氛圍,網(wǎng)頁中常見的聲音格式有WAV、MP3、MIDI、AIF、RA、或Real Audio格式。 1、添加背景音樂 在頁面中可以嵌入背景音樂。這種音樂多以MP3,MIDI文件為主,在DW中,添加背景音樂有兩種方法,一種是通過手寫代碼實現(xiàn),還有一種是通過行為實現(xiàn)。 在HTML語言中,通過<BGS
38、OUNG>這個標(biāo)記可以嵌入多種格式的音樂文件,具體步驟是: 我們將01.mid音樂文件存放在med文件夾里。 打開03.html網(wǎng)頁,我們?yōu)檫@個頁面添加背景音樂 切換到DW的“拆分”視圖,講光標(biāo)定位到</body>之前的位置,在光標(biāo)的位置寫下下面這段代碼:<bgsound srcmed/01.mid>,如下圖所示。 按下F12鍵,在瀏覽器中查看效果,我們可以聽見背景音樂聲。如果希望循環(huán)播放音樂,將剛才的源代碼修改為以下代碼即可: <bgsound src="med/01.mid" loop="true">2、嵌入
39、音樂嵌入音頻可以將聲音直接插入頁面中,但只有瀏覽者在瀏覽網(wǎng)頁時具有所選聲音文件的適當(dāng)插件后,聲音才可以播放。如果希望在頁面顯示瀏覽器的外觀,可以使用這種方法。打開02.html網(wǎng)頁,將光標(biāo)放置于我們想要顯示播放器的位置。單擊快捷欄上的“媒體”按鈕,從下拉列表中選擇“插件”。推薦精選彈出“選擇文件”對話框,在對話框中02.war音頻文件。單擊確定按鈕后,插入的插件在文檔窗口中以下圖所示圖標(biāo)來顯示。選中該圖標(biāo),在屬性面板中可以對播放器的屬性進行設(shè)置:要實現(xiàn)循環(huán)播放音樂的效果,單擊屬性面板中的“參數(shù)”按鈕,然后單擊“”按鈕,在“參數(shù)”列中輸入loop,并在“值”列中輸入true后,單擊“確定”按鈕。
40、要實現(xiàn)自動播放,可以繼續(xù)編輯參數(shù),在參數(shù)對話框的“參數(shù)”列中輸入autostart,并在值中輸入true,單擊“確定”按鈕。推薦精選按下F12鍵,打開瀏覽器預(yù)覽,這個頁面實現(xiàn)了嵌入音樂的效果,在瀏覽器里顯示了播放插件。六、Dreamweaver 8 創(chuàng)建鏈接關(guān)系 鏈接是一個網(wǎng)站的靈魂,一個網(wǎng)站是由多個頁面組成的,而這些頁面之間依據(jù)鏈接確定相互之間的導(dǎo)航關(guān)系。超級鏈接是指站點內(nèi)不同網(wǎng)頁之間、站點與Web之間的鏈接關(guān)系,它可以使站點內(nèi)的網(wǎng)頁成為有機的整體,還能夠使不同站點之間建立聯(lián)系。超級鏈接由兩部分組成:鏈接載體和鏈接目標(biāo)。許多頁面元素可以作為鏈接載體,如:文本、圖像、圖像熱區(qū)、動畫等。而鏈接目
41、標(biāo)可以是任意網(wǎng)絡(luò)資源,如:頁面、圖像、聲音、程序、其他網(wǎng)站、Email甚至是頁面中的某個位置 - 錨點。鏈接的類型如果按鏈接目標(biāo)分類,可以將超級鏈接分為以下幾種類型:* 內(nèi)部鏈接:同一網(wǎng)站文檔之間的鏈接。* 外部鏈接:不同網(wǎng)站文檔之間的鏈接。* 錨點鏈接:同一網(wǎng)頁或不同網(wǎng)頁中指定位置的鏈接。* E-mail鏈接:發(fā)送電子郵件的鏈接。1、關(guān)于鏈接路徑絕對路徑,為文件提供完全的路徑,包括適用的協(xié)議,例如http、ftp,rtsp等。 /相對路徑,相對路徑最適合網(wǎng)站的內(nèi)部鏈接。如果鏈接到同一目錄下,則只需要輸入要鏈接文件的名稱。要鏈接到下一級目錄中的文件,只需要輸
42、入目錄名。然后輸入“/“,再輸入文件名。如鏈接到上一級目錄中的文件,則先輸入”./“再輸入目錄名,文件名。根路徑:是指從站點根文件夾到被鏈接文檔經(jīng)由的路徑,以前斜杠開頭,例如, /fy/maodian.html就是站點根文件夾下的fy子文件夾中的一個文件(maodian.html )的根路徑。2、創(chuàng)建外部鏈接不論是文字還是圖像,都可以創(chuàng)建鏈接到絕對地址的外部鏈接。創(chuàng)建鏈接的方法可以直接輸入地址也可以使用超級鏈接對話框。(1)直接輸入地址打開02.html頁面,輸入并選中文字“閃客啟航網(wǎng)頁技術(shù)區(qū)”。在屬性面板中,“鏈接”用來設(shè)置圖像或文字的超鏈接,“目標(biāo)”用來設(shè)置打開方式。我們在“鏈接”文本框直
43、接輸入外部絕對地址,在“目標(biāo)”項的下拉列表中選擇_blank(在一個新的未命名的瀏覽器窗口中打開鏈接)。如下圖所示。 推薦精選(2)使用超級鏈接對話框打開03.html頁面,選中文字“閃客啟航”。單擊常用快捷欄中的“超級鏈接”按鈕。彈出“超級鏈接”對話框,我們進行以下各項的設(shè)置:“文本”文本框用來設(shè)置超級鏈接顯示的文本。“鏈接”用來設(shè)置超鏈接連接到的路徑?!澳繕?biāo)”下拉列表框用來設(shè)置超鏈接的打開方式,有四個選項?!皹?biāo)題”文本框用來設(shè)置超鏈接的標(biāo)題。設(shè)置好后,單擊“確定”按鈕,向網(wǎng)頁中插入超鏈接。3、創(chuàng)建內(nèi)部鏈接在文檔窗口選中文字,單擊屬性面板“鏈接”后的按鈕,彈出“選擇文件”對話框,選擇要鏈接到
44、的網(wǎng)頁文件,即可鏈接到這個網(wǎng)頁。我們也可以拖動“鏈接”后的按鈕到站點面板上的相應(yīng)網(wǎng)頁文件,則鏈接將指向這個網(wǎng)頁文件。此外,我們還可以直接將相對地址輸入到“鏈接”文本框里來鏈接一個頁面。4、創(chuàng)建Email鏈接單擊常用快捷欄中的“電子郵件鏈接”按鈕,彈出“電子郵件鏈接”對話框,在對話框的文本框那輸入要鏈接的文本,然后在Email文本框內(nèi)輸入郵箱地址即可。5、創(chuàng)建錨點鏈接所謂錨點鏈接,是指在同一個頁面中的不同位置的鏈接。打開一個頁面較長的網(wǎng)頁,將光標(biāo)放置于要插入錨點的地方,單擊常用快捷欄的“命名錨記”按鈕,插入錨點。再選中需要鏈接錨點的文字,再屬性面板中拖動鏈接后的到錨點上即可。6、制作圖像映射打開
45、03.html文件,選中102。gif圖片,在屬性面板中,有不同形狀的圖像熱區(qū)按鈕,選擇一個熱區(qū)按鈕單擊。然后在圖像上需要創(chuàng)建熱區(qū)的位置拖動鼠標(biāo),即可創(chuàng)建熱區(qū)。此時,選中的部分被稱著圖像熱點。選中這個圖像熱點,在屬性面板上可以給這個圖像熱點設(shè)置超鏈接即可?,F(xiàn)在,請發(fā)揮你的想象力,巧妙運用各種頁面元素來豐富你的網(wǎng)頁,把它裝扮的更加生動和精彩!七、Dreamweaver 8 創(chuàng)建CSS樣式 層疊樣式表 (CSS) 是一系列格式設(shè)置規(guī)則,它們控制 Web 頁面內(nèi)容的外觀。使用 CSS 設(shè)置頁面格式時,內(nèi)容與表現(xiàn)形式是相互分開的。頁面內(nèi)容(HTML 代碼)位于自身的 HTML 文件中,而定義代碼表現(xiàn)形
46、式的 CSS 規(guī)則位于另一個文件(外部樣式表)或 HTML 文檔的另一部分(通常為 <head> 部分)中。使用 CSS 可以非常靈活并更好地控制頁面的外觀,從精確的布局定位到特定的字體和樣式等。推薦精選術(shù)語“層疊”是指對同一個元素或 Web 頁面應(yīng)用多個樣式的能力。例如,可以創(chuàng)建一個 CSS 規(guī)則來應(yīng)用顏色,創(chuàng)建另一個規(guī)則來應(yīng)用邊距,然后將兩者應(yīng)用于一個頁面中的同一文本。所定義的樣式“層疊”到您的 Web 頁面上的元素,并最終創(chuàng)建您想要的設(shè)計。CSS樣式表的創(chuàng)建,可以統(tǒng)一定制網(wǎng)頁文字的大小、字體、顏色、邊框、鏈接狀態(tài)等效果。在Dreamweaver 8中CSS樣式的設(shè)置方式有了很
47、大的改進,更為方便、實用、快捷。(一)、創(chuàng)建CSS樣式1、選中菜單“窗口”>“CSS樣式”。打開CSS樣式面板。2、單擊“CSS樣式”面板右下角的“新建CSS規(guī)則”按鈕,打開“新建CSS規(guī)則”對話框。在“選擇器類型”選項中,可以選擇創(chuàng)建CSS樣式的方法包括以下三種:類:我們可以在文檔窗口的任何區(qū)域或文本中應(yīng)用類樣式,如果將類樣式應(yīng)用于一整段文字,那么會在相應(yīng)的標(biāo)簽中出現(xiàn)CLASS屬性,該屬性值即為類樣式的名稱。標(biāo)簽(重新定義特定標(biāo)簽的外觀):重新定義HTML標(biāo)記的的默認格式。我們可以針對某一個標(biāo)簽來定義層疊樣式表,也就是說定義的層疊樣式表將只應(yīng)用于選擇的標(biāo)簽。例如,我們?yōu)?lt;body
48、>和</body>標(biāo)簽定義了層疊樣式表,那么所有包含在<body>和</body>標(biāo)簽的內(nèi)容將遵循定義的層疊樣式表。高級(ID、偽類選擇器等):為特定的組合標(biāo)簽定義層疊樣式表,使用ID作為屬性,以保證文檔具有唯一可用的值。高級樣式是一種特殊類型的樣式,常用的有4種:a:link設(shè)定正常狀態(tài)下鏈接文字的樣式。a:active 設(shè)定鼠標(biāo)單擊時鏈接的外觀。a:visited設(shè)定訪問過的鏈接的外觀。a:hover 設(shè)定鼠標(biāo)放置在鏈接文字之上時,文字的外觀。3、為新建CSS樣式輸入或選擇名稱、標(biāo)記或選擇器,其中:對于自定義樣式,其名稱必須以點(.)開始,如果沒有
49、輸入該點,則DW回自動添加上。自定義樣式名可以是字母與數(shù)字的組合,但.之后必須是字母。推薦精選對于重新定義HTML標(biāo)記,可以在“標(biāo)簽”下拉列表中輸入或選擇重新定義的標(biāo)記。對于CSS選擇器樣式,可以在“選擇器”下拉列表中輸入或選擇需要的選擇器。4、在“定義在”區(qū)域選擇定義的樣式位置,可以是“新建樣式表文件”或“僅對該文檔”。單擊“確定”按鈕,如果選擇了“新建樣式表文件”選項,回彈出“保存樣式表文件為”對話框,給樣式表命名,保存后,回彈出“CSS規(guī)則定義”對話框。如果選擇了“僅對該文檔”,則單擊“確定”后,直接彈出“CSS規(guī)則定義”,在其中設(shè)置CSS樣式。5、“CSS規(guī)則定義”對話框中設(shè)置CSS規(guī)
50、則定義。主要分為類型、背景、區(qū)塊、方框、邊框、列表、定位和擴展8項。每個選項都可以對所選標(biāo)簽做不同方面的定義,可以根據(jù)需要設(shè)定。定義完畢后,單擊“確定”按鈕,完成創(chuàng)建CSS樣式。 (二)、Dreamweaver 8 使用CSS樣式美化頁面 在“CSS規(guī)則對話框”中,我們可以通過類型、背景、區(qū)塊、方框、邊框、列表、定位和擴展項的設(shè)置,來美化我們的頁面,當(dāng)然啦,我們在定義某個CSS樣式的時候,不需要對每一個項都進行設(shè)置,需要什么效果,選擇相應(yīng)的項進行設(shè)置就可以了。1、文本樣式的設(shè)置新建CSS樣式, “選擇器類型”為類,名稱為 “style1”定義在“僅對該文檔”。保存至站點根目錄下的CSS文件夾內(nèi)
51、,彈出“CSS規(guī)則定義”對話框,默認顯示的就是對文本進行設(shè)置的“類型”項。字體:可以在下拉菜單種選擇相應(yīng)的字體。大?。捍笮【褪亲痔?,可以直接填入數(shù)字,然后選擇單位。樣式:設(shè)置文字的外觀,包括正常、斜體、偏斜體。行高:這項設(shè)置在網(wǎng)頁制作種很常用。設(shè)置行高,可以選擇“正?!?,讓計算機自動調(diào)整行高,也可以使用數(shù)值和單位結(jié)合的形式自行設(shè)置。需要注意的是,單位應(yīng)該和文字的單位一致,行高的數(shù)值是包括字號數(shù)值在內(nèi)的。例如,文字設(shè)置為12pt,如果要創(chuàng)建一倍行距,則行高應(yīng)該為24pt。變量:在英文種,大寫字母的字號一般比較大,采用“變量”中的“小型大寫字母”設(shè)置,可以縮小大寫字母。顏色:設(shè)置文字的色彩。2、背
52、景樣式的設(shè)置在HTML中,背景只能使用單一的色彩或利用圖像水平垂直方向的平鋪。使用CSS之后,有了更加靈活的設(shè)置。推薦精選在CSS規(guī)則定義”對話框左側(cè)選擇“背景”項,可以在右邊區(qū)域設(shè)置CSS樣式的背景格式。背景顏色:選擇固定色作為背景。背景圖像:直接填寫背景圖像的路徑,或單擊“瀏覽”按鈕找到背景圖像的位置。重復(fù):在使用圖像作為背景的時,可以使用此項設(shè)置背景圖像的重復(fù)方式,包括“不重復(fù)”、“重復(fù)”、“橫向重復(fù)”、和“縱向重復(fù)“。附件:選擇圖像做背景的時候,可以設(shè)置圖像是否跟隨網(wǎng)頁一同滾動。水平位置:設(shè)置水平方向的位置,可以“左對齊“右對齊”、“居中”。還可以設(shè)置數(shù)值與單位結(jié)合表示位置的方式,比較
53、常用的是像素單位。垂直位置:可以選擇“頂部”、“底部”、“居中”。還可以設(shè)置數(shù)值和單位結(jié)合表示位置的方式。3、區(qū)塊樣式設(shè)置在CSS規(guī)則定義”對話框左側(cè)選擇“區(qū)塊”項,可以在右邊區(qū)域設(shè)置CSS樣式的區(qū)塊格式。單詞間距“英文單詞之間的距離,一般選擇默認設(shè)置。字母間距:設(shè)置英文字母間距,使用正值為增加字母間距,使用負值為減小字母間距。垂直對齊:設(shè)置對象的垂直對齊方式。文本對齊:設(shè)置文本的水平對齊方式。文字縮進:這是最重要的項目。中文文字的首行縮進就是由它來實現(xiàn)的。首先填入具體的數(shù)值,然后選擇單位。文字的縮進和字號要保持統(tǒng)一。如字號為12px,像創(chuàng)建兩個中文自的縮進效果,文字縮進就應(yīng)該為18px??崭?/p>
54、:對源代碼文字空格的控制。選擇“正?!?,忽略源代碼文字之間的所有空格。選擇“保留”,將保留源代碼中所有的空格形式,包括由空格鍵、Tab鍵、Enter鍵創(chuàng)建的空格。顯示:制定是否以及如何顯示元素。選擇“無”則關(guān)閉它被制定給的元素的顯示。在實際控制中很少使用。4、方框樣式的設(shè)置在前面我們設(shè)置過圖像的大小、設(shè)置圖像水平和垂直方向上的空白區(qū)域、設(shè)置圖像是否有文字環(huán)繞效果等。方框設(shè)置進一步完善、豐富了這些設(shè)置。在CSS規(guī)則定義”對話框左側(cè)選擇“方框”項,可以在右邊區(qū)域設(shè)置CSS樣式的方框格式。寬:通過數(shù)值和單位設(shè)置對象的寬度。高:通過設(shè)置和單位設(shè)置對象的高度。浮動:實際就是文字等對象的環(huán)繞效果。選擇“右對齊”、對象居右。文字等內(nèi)容從另外一側(cè)環(huán)繞對象。選擇“左對齊”。對象居左,文字等內(nèi)容從另一側(cè)環(huán)繞?!盁o”取消環(huán)繞效果。清除:規(guī)定對象的一側(cè)不許有層??梢酝ㄟ^選擇“左對齊”、“右對齊”,選擇不允許出現(xiàn)層的一側(cè)。如果在清除層的一側(cè)有層,對象將自動移到層的下面?!皟烧摺笔侵缸笥叶疾辉试S出現(xiàn)層?!盁o”是不限制層的出現(xiàn)?!疤畛洹焙汀斑吔纭保喝绻麑ο笤O(shè)置了邊框,“填充”是指邊框和其中內(nèi)容之間的空白區(qū)域;“邊界”是指邊框外側(cè)的空白區(qū)域。5、邊框樣式設(shè)置邊框樣式設(shè)置可以給
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 豐潤墻體保溫施工方案
- 鑄鐵閘門施工方案
- 露天收縮大棚施工方案
- 吊頂工程施工方案
- 懸挑工字鋼支模架施工方案
- h型鋼施工方案
- 別墅墻面防水層施工方案
- 混凝土防水密實劑施工方案
- 學(xué)校鐵藝門拆除施工方案
- 玫瑰金鏡面線條施工方案
- 2025年黑龍江職業(yè)學(xué)院單招職業(yè)適應(yīng)性測試題庫附答案
- 《多樣的中國民間美術(shù)》課件 2024-2025學(xué)年人美版(2024)初中美術(shù)七年級下冊
- 家政講師培訓(xùn)課件
- 2024年西安電力高等??茖W(xué)校高職單招職業(yè)技能測驗歷年參考題庫(頻考版)含答案解析
- 2024年牡丹江大學(xué)單招職業(yè)適應(yīng)性測試題庫帶答案
- 統(tǒng)編版(2024新版)七年級下冊道德與法治期末復(fù)習(xí)背誦知識點提綱
- GB/T 44679-2024叉車禁用與報廢技術(shù)規(guī)范
- 人教版新起點(一年級起)二年級英語下冊教案全冊
- 田字格(綠色標(biāo)準)
- 上海對外經(jīng)貿(mào)大學(xué)外事禮品管理試行
- 最新界線測繪的基本知識
評論
0/150
提交評論