Fireworks的功能

1、第一講 Fireworks的功能v制作矢量圖（圖形）v編輯位圖（圖像）v制作網(wǎng)頁v優(yōu)化一、窗口組成主要由菜單、工具欄、工具箱、工作區(qū)和浮動(dòng)面板組成。 1、工作區(qū)標(biāo)題欄上有顯示比例、*未保存標(biāo)記。 2、上方有4個(gè)選項(xiàng)卡，分別為： a) 原始：主要的工作窗口，文件均在此選項(xiàng)卡中被編輯。 b) 預(yù)覽：預(yù)覽模式。即目前正在編輯的文件在網(wǎng)頁中的顯示狀態(tài)。 c) 2幅、4幅：用于比較并預(yù)覽編輯中的對(duì)象輸出時(shí)的相關(guān)數(shù)據(jù)。 3、“屬性”面板最初顯示文檔的屬性，然后當(dāng)在文檔中工作時(shí)，它將改為顯示新近所選工具或當(dāng)前所選對(duì)象的屬性。二、矢量圖與位圖矢量圖形使用稱為矢量的線條（包括顏色和位置信息）和線條所包圍的區(qū)域（

2、即填充）的顏色描述圖象。編輯矢量圖形時(shí)，修改的是描述其形狀的線條的屬性。矢量圖形與分辨率無關(guān)。位圖圖形由排列成網(wǎng)格的稱為象素的點(diǎn)組成。計(jì)算機(jī)的屏幕就是一個(gè)大的象素網(wǎng)格。編輯位圖圖形時(shí)，修改的是象素，而不是線條。位圖圖形與分辨率有關(guān)。三、工具 1、“指針”工具用來選擇對(duì)象的（單擊對(duì)象或在其周圍拖動(dòng)選區(qū)）。 2、后方選取工具可以用來選取被覆蓋的對(duì)象。 3、局部輸出工具可以指定一個(gè)區(qū)域，輸出成獨(dú)立的圖形文件。路徑創(chuàng)建工具 4、形狀繪圖工具 分為矩形、圓角矩形、圓形、多邊形工具； Alt固定中心點(diǎn)；Shift設(shè)置正圓或方 設(shè)置圓角矩形的角度在屬性面板的矩形圓度。 當(dāng)選中多邊形工具時(shí)，在屬性面板中的形狀

3、可設(shè)置多邊形和星形兩種模式，并可以隨意設(shè)置邊數(shù)（325）和角度。 工具5、鋼筆工具繪制連續(xù)的直線和貝塞爾曲線；繪制后可配合部分選定工具來加以修整；且增加和刪除節(jié)點(diǎn)。（直線和曲線相互轉(zhuǎn)化）6、矢量路徑工具繪制自由變形矢量路徑，通過屬性面板選擇刷子筆觸類別，包括“噴槍”、“毛筆”、“炭筆”、“蠟筆”和“非自然”。7、重繪路徑工具重繪或擴(kuò)展所選局部線段，同時(shí)保留該路徑的筆觸、填充和效果特性。路徑修改和編輯工具8、部分選定工具能夠選擇路徑上的點(diǎn)并拖動(dòng)點(diǎn)和點(diǎn)手柄來更改該對(duì)象的形狀。按 alt 鍵并拖動(dòng)，以便一次拖動(dòng)一個(gè)手柄。工具9、自由變形工具能夠直接對(duì)矢量對(duì)象執(zhí)行彎曲和變形操作而不是對(duì)各個(gè)點(diǎn)執(zhí)行操作。

4、拉伸所選路徑和推動(dòng)所選路徑兩種方式。（改變推動(dòng)指針的大小，右箭頭鍵或左箭頭鍵）10、“更改區(qū)域形狀”工具拉伸變形區(qū)域指針外圓內(nèi)的所有選定路徑的區(qū)域，內(nèi)圓是工具的全強(qiáng)度邊界。11、裁切工具 功能：裁切各種矢量圖形，將其一分為二。在位圖模式下為橡皮擦工具。12、縮放工具以水平、垂直方向或同時(shí)以兩種方向放大或縮小對(duì)象，旋轉(zhuǎn)對(duì)象（將中心點(diǎn)拖離中心，可以重新定位旋轉(zhuǎn)軸）。13、傾斜工具通過將對(duì)象沿水平軸、垂直軸或兩個(gè)軸同時(shí)傾斜達(dá)到變形效果。 14、“扭曲”工具可以通過拖動(dòng)選擇手柄更改對(duì)象的大小和比例。矢量圖操作編輯矢量圖形 1.移動(dòng)和復(fù)制圖形 2.放大和縮小圖形 3.扭曲圖形 4.旋轉(zhuǎn)與翻轉(zhuǎn)圖形 5.傾

5、斜圖形 圖形間的相互作用 一、排列順序 二、對(duì)齊 三、組合路徑1、合并： a) 將多個(gè)對(duì)象合并為一個(gè)，組件的屬性將全部同最底層的對(duì)象保持一致，相交部分成鏤空狀態(tài)。 b) 可以閉合非封閉圖形。 2、拆分：拆分后的所有對(duì)象的屬性都被下面圖形的屬性同化了。 3、聯(lián)合：聯(lián)集后的物體顏色以最下層的物體保持一致，而形狀則是兩個(gè)物體的總和。 4、相交：交集后的物體顏色以最下層的物體保持一致，而形狀則是兩個(gè)物體重疊部分。 5、打孔：上面的物體將下面的物體相交的部分切割。 6、裁切：以上面的物體來裁剪下面的，其他物體與上面物體相交部分保留。 四、 群組1、群組 2、解散群組文字文字對(duì)文字執(zhí)行的操作：設(shè)置文本的字

6、體、字號(hào)、字型和顏色；控制字距、行距和垂直排列；將文字縮放、扭曲、傾斜；將文本附著于路徑；將文本轉(zhuǎn)化為路徑。一、文本附加路徑 1.文本結(jié)合路徑 a）同時(shí)選中文本和路徑，選擇文本菜單下的“附加到路徑”命令。 b）選擇文本菜單下的“方向”命令，從子菜單中選擇所需要的方向依路徑旋轉(zhuǎn)； 垂直； 垂直傾斜； 水平傾斜選擇“翻轉(zhuǎn)方向”命令可以實(shí)現(xiàn)文本在垂直方向上的翻轉(zhuǎn)。2.分離文字附加路徑選擇文本菜單下的“從路徑脫離”命令。3.更改文本路徑其始點(diǎn)在屬性面板中修改“文本偏移”二、文本轉(zhuǎn)化為路徑方法：選中文本后，選擇文本菜單下的“轉(zhuǎn)換為路徑”命令。轉(zhuǎn)換后就像對(duì)待矢量對(duì)象那樣，編輯字母的形狀。一旦將文本轉(zhuǎn)換為路

7、徑，則所有的矢量編輯工具都可用來編輯該文本。然而，無法再將它作為文本編輯。效果Macromedia Fireworks MX 動(dòng)態(tài)效果是可以用于矢量對(duì)象、位圖圖象和文本的增強(qiáng)效果。動(dòng)態(tài)效果包括：斜角和浮雕、投影和光暈、顏色校正、模糊和銳化。可以直接從屬性檢查器中將動(dòng)態(tài)效果應(yīng)用于所選對(duì)象。 說明：可以使用屬性檢查器將一個(gè)或多個(gè)動(dòng)態(tài)效果應(yīng)用于所選對(duì)象?？梢源蜷_、關(guān)閉或修改每種效果。特效一、斜角和浮雕效果一、斜角和浮雕效果1. 內(nèi)斜角:產(chǎn)生內(nèi)凸起的效果2.外斜角:在對(duì)象上加一個(gè)外部斜邊3.內(nèi)浮雕:產(chǎn)生外圍的內(nèi)陷效果4.凹出浮雕:在外圍產(chǎn)生一個(gè)凹出的效果二、陰影和光暈效果二、陰影和光暈效果1. 內(nèi)側(cè)陰

8、影 2.內(nèi)側(cè)發(fā)光3.發(fā)光 4.投影三、模糊特效三、模糊特效四、銳化四、銳化五、五、 Adjust Color顏色調(diào)整顏色調(diào)整1.亮度和對(duì)比度使用調(diào)整亮度/對(duì)比度可以生成高亮、陰影或中間色調(diào)的圖像。亮度：指在某一方向上，投射到單位表面的強(qiáng)度，亮度越小，表示光源所發(fā)出的光越??；亮度越大，表示光源所發(fā)出的光越強(qiáng)；對(duì)比度：指圖像中各部分之間的明暗對(duì)比程度。對(duì)于像素顏色，表現(xiàn)為色相性質(zhì)相反、光度明暗差別大的顏色（如紅與綠、黃與紫、橙與青等）之間的落差程度。對(duì)比度越強(qiáng)，顏色之間的落差越大；對(duì)比度越小，顏色落差越小。2.反相指對(duì)圖像中每個(gè)像素的顏色進(jìn)行反相。例如，對(duì)于紅色，其RGB值為（255,0,0），反

9、相后可以得到RGB值為（0,255,255）的顏色，即亮藍(lán)色。 3.曲線曲線功能可以對(duì)色調(diào)范圍提供更精確的控制。使用曲線功能，可以調(diào)整色調(diào)范圍中的任何顏色，而不會(huì)影響其它顏色。水平軸：表示像素的原始亮度，其值顯示在“輸入”框中。垂直軸：表示新的亮度值，其值顯示在“輸出”框中。4.自動(dòng)色階:自動(dòng)調(diào)整顏色搭配5.色相和飽和度色相：指圖像中顏色的純凈程度。飽和度：指圖像中顏色的飽滿程度。亮度：指圖像中顏色的明亮程度。6.色階調(diào)整色階可以修正圖像中的亮區(qū)和暗區(qū)的分布。“色調(diào)分布圖”是像素在高亮、中間色調(diào)和陰影部分分布情況的圖形表示形式。水平軸：表示從最暗 (0) 到最亮 (255) 的顏色值。從左向右

10、觀察水平軸：較暗的像素在左邊，中間色調(diào)像素在中間，較亮的像素在右邊。垂直軸表示每個(gè)亮度級(jí)的像素?cái)?shù)目。7.顏色填充：將繪制好的對(duì)象再融入其它顏色。六、其他特效六、其他特效 1. 灰度化:將對(duì)象轉(zhuǎn)化為黑白成分的灰度色。 2. 查找邊緣:突出對(duì)象比較明顯的輪廓，在將其它部分灰度化。七、Eye Candy 4000 LE1.Bevel Boss2.Marble 3.Motion Trail 位圖的編輯步驟1.位圖是由像素構(gòu)成的，不可能對(duì)位圖進(jìn)行逐點(diǎn)修改，而是畫定一個(gè)范圍，這就是選區(qū)。 2.位圖圖像的編輯步驟： a)根據(jù)要求，制作選區(qū)； b)對(duì)選區(qū)進(jìn)行調(diào)整； c）填充、調(diào)整顏色或制作效果。 選區(qū)工具1.

11、 矩形選區(qū)：選取一個(gè)矩形范圍。 2.圓形選區(qū)：選取一個(gè)圓形范圍。 3.多邊形套索：單擊鼠標(biāo)左鍵，得到一個(gè)多邊形選區(qū)。 4.曲線套索：按下鼠標(biāo)拖拽，得到一個(gè)任意形狀的選區(qū)。 5.魔術(shù)棒工具：選擇一塊顏色相近的范圍。說明： 1.最小選區(qū)：可以是2*2像素，使用鼠標(biāo)很難作出如此小的選區(qū)，通過屬性面板。 2.設(shè)置選區(qū)的的樣式、邊界和魔術(shù)棒工具的容差、羽化值是通過屬性面板。選區(qū)的使用方法v1.畫正圓或正方選區(qū)：先畫選區(qū)，再按下Shift鍵。v2.加選選區(qū)：先按下Shift鍵，再畫其它選區(qū)v3.減選選區(qū)：先按下Alt鍵，再畫其它選區(qū)。v4.在繪制的同時(shí)按Alt鍵，是從鼠標(biāo)按下的位置放射的繪制選區(qū)。v5.按

12、住 Alt+Shift 鍵 ，可創(chuàng)建重疊原選取框的新選取框。v6.在繪制的同時(shí)按空格鍵可以重新定位選取框。選區(qū)繪制后的操作1. 選區(qū)工具下，可使用鼠標(biāo)將選區(qū)移動(dòng)。2. 選取工具下，用鼠標(biāo)可以直接將選區(qū)中的內(nèi)容移動(dòng)，原圖被截取。3. 次選取工具下，用鼠標(biāo)可以直接將選區(qū)中的內(nèi)容移動(dòng)，原圖被保留。選區(qū)設(shè)置羽化值、收縮、擴(kuò)展等操作是通過選擇菜單中的命令。其他位圖工具v1.“橡皮圖章”工具可以把圖象的一個(gè)區(qū)域復(fù)制或克隆到另一個(gè)區(qū)域中。 “Alt”改變?nèi)狱c(diǎn)。 v2.“模糊”工具減弱圖象中所選區(qū)域的焦點(diǎn)。3.“涂抹”工具拾取顏色并在圖象中推移該顏色。4.“銳化”工具銳化圖象中的區(qū)域。5.“減淡”工具加亮圖

13、象中的部分區(qū)域。6.“加深”工具加深圖象中的部分區(qū)域。蒙板蒙版能夠隱藏或顯示對(duì)象或圖象的某些部分。1.“粘貼為蒙版”命令創(chuàng)建蒙版，方法是用另一個(gè)對(duì)象來掩蓋一個(gè)對(duì)象或一組對(duì)象。2.添加透明的空位圖蒙版的最快捷方法是使用“層”面板。“層”面板在對(duì)象中添加一個(gè)白色蒙版，可以自定義這個(gè)蒙版，方法是用位圖工具在它上面繪制。 白色總是顯示被蒙版對(duì)象，而黑色總是隱藏被蒙版對(duì)象動(dòng)畫基本知識(shí)：幀：是構(gòu)成動(dòng)畫的基本單位。制作方法：1.幀幀動(dòng)畫2.過渡動(dòng)畫3.動(dòng)畫元件生成的動(dòng)畫 一、幀幀動(dòng)畫（實(shí)例）1.導(dǎo)入一幅圖片（600400）2.創(chuàng)建一個(gè)新層2，繪制一個(gè)矩形（610410）3.矩形添加濾鏡：雜點(diǎn)（200）、運(yùn)動(dòng)

14、模糊（52，22）4.新建幀2，將矩形復(fù)制到幀2中，向左下移動(dòng)5.選擇幀1，將層1共享二、過渡動(dòng)畫原理是在兩幅關(guān)鍵圖中間通過插值的方法來獲得兩幅圖間的過渡圖。注意：首尾兩幅圖必須是同一元件的兩個(gè)實(shí)例。1創(chuàng)建元件和實(shí)例 元件是可以重復(fù)使用的圖形、動(dòng)畫和按鈕。實(shí)例是將元件拖入到文檔中，在文檔的具體體現(xiàn)。從頭開始創(chuàng)建；（編輯插入新建元件）將已有的對(duì)象轉(zhuǎn)換為元件。（修改元件轉(zhuǎn)換元件）2創(chuàng)建過渡動(dòng)畫兩次拖入元件，生成在不同位置的兩個(gè)實(shí)例選擇這兩個(gè)實(shí)例，執(zhí)行【修改】【元件】【補(bǔ)間實(shí)例】命令三、動(dòng)畫元件生成的動(dòng)畫1創(chuàng)建動(dòng)畫元件 選擇一個(gè)要產(chǎn)生動(dòng)畫效果的對(duì)象。 執(zhí)行 修改動(dòng)畫選擇 動(dòng)畫命令2修改動(dòng)畫元件屬性（

15、1）修改運(yùn)動(dòng)路徑（2）其他屬性 四、說明四、說明 1.設(shè)置幀延時(shí) 幀延時(shí)決定當(dāng)前幀顯示的時(shí)間長度。A.選擇一個(gè)或多個(gè)幀；B. 雙擊幀延時(shí)列。C. 在“幀延時(shí)”窗口輸入值。共享層如果希望對(duì)象在動(dòng)畫中一直出現(xiàn)，可將它們放置在某一層上，然后使用“層”面板在幀間共享該層。當(dāng)一個(gè)層在各幀間共享時(shí)，該層中的所有對(duì)象在每個(gè)幀中都是可見的。 建立共享層的方法：1.雙擊層；選擇“共享交疊幀”。2.從“幀”面板的“選項(xiàng)”菜單中選擇“共享此層”。取消共享網(wǎng)頁設(shè)計(jì)知識(shí)基礎(chǔ)一、網(wǎng)站、網(wǎng)頁和主頁（略）二、網(wǎng)站設(shè)計(jì)的工作流程（詳）三、HTML （詳）一、網(wǎng)站、網(wǎng)頁和主頁1.網(wǎng)頁：是用HTML語言編寫的，通過WWW網(wǎng)傳輸，并

16、被Web瀏覽器翻譯成可顯示出來的集合文本、圖片、聲音和數(shù)字電影等信息形式的頁面文件。由站標(biāo)、導(dǎo)航欄、廣告欄和信息區(qū)等組成。2 .網(wǎng)頁分類主頁：是站點(diǎn)所有網(wǎng)頁的鏈接中心，一般在訪問一個(gè)網(wǎng)站時(shí)首先看到的網(wǎng)頁。專題網(wǎng)頁：是對(duì)網(wǎng)站內(nèi)容的進(jìn)一步細(xì)化和歸類，是主頁和內(nèi)容網(wǎng)頁的中轉(zhuǎn)站。內(nèi)容網(wǎng)頁：是對(duì)網(wǎng)站所傳達(dá)信息的具體體現(xiàn)，位于網(wǎng)站鏈接結(jié)構(gòu)的終端。 功能網(wǎng)頁：是一些專門用于訪問者信息反饋、網(wǎng)站用戶注冊(cè)等方面的網(wǎng)站用戶服務(wù)性質(zhì)的網(wǎng)頁。3.網(wǎng)頁關(guān)系圖4.網(wǎng)站 由各種類型的網(wǎng)頁通過超級(jí)鏈接的形式組成。二、網(wǎng)站設(shè)計(jì)的工作流程1.確定網(wǎng)站主題2. 規(guī)劃網(wǎng)站欄目和網(wǎng)站目錄結(jié)構(gòu) a.網(wǎng)站欄目劃分要服從并體現(xiàn)網(wǎng)站主題 b.

17、網(wǎng)站主要內(nèi)容要打破欄目層次束縛 c.不要將所有的文件都存放在根目錄下 d.按欄目內(nèi)容建立子目錄 e.每個(gè)主目錄下都建立獨(dú)立的Image目錄 f.目錄文件的命名規(guī)則 3. 確定網(wǎng)頁版面布局 a.“同” 字型 b. “廠”字型 c. 標(biāo)題正文型 d.分欄型5.搜集制作網(wǎng)頁的素材6.整合網(wǎng)頁素材7.添加網(wǎng)頁特效、CSS樣式等8.測試和發(fā)布網(wǎng)站HTML語言vHTML（Hyper Text Markup Language），是網(wǎng)頁構(gòu)成的基本元素。v語法包括：標(biāo)記：是一組字符串符號(hào)，主要用于再HTML文件中標(biāo)示供瀏覽器顯示的文件內(nèi)容的顯示格式描述。屬性：每一種標(biāo)記都具有屬性。通過屬性的使用，來定義標(biāo)記對(duì)象

18、的具體顯示格式的編排方式。v編寫環(huán)境：記事本 我的網(wǎng)頁 用HTML編寫的網(wǎng)頁 HTML不是一種程序語言，而是一種描述文檔結(jié)構(gòu)的標(biāo)記語言。 文件基本結(jié)構(gòu)文件基本結(jié)構(gòu)說明： 文件標(biāo)簽，表示文檔的開始和結(jié)束。 文件頭標(biāo)簽，放置的是關(guān)于這個(gè)文件的信息，包含文件的標(biāo)題、編碼方式和URL等。標(biāo)題標(biāo)簽，設(shè)定文件的標(biāo)題名稱。文件主體標(biāo)簽，網(wǎng)頁中所要顯示的所有內(nèi)容，都放置在這一對(duì)標(biāo)簽中。body有一些常見的屬性格式為： 說明： 文件標(biāo)簽，表示文檔的開始和結(jié)束。 文件頭標(biāo)簽，放置的是關(guān)于這個(gè)文件的信息，包含文件的標(biāo)題、編碼方式和URL等。標(biāo)題標(biāo)簽，設(shè)定文件的標(biāo)題名稱。文件主體標(biāo)簽，網(wǎng)頁中所要顯示的所有內(nèi)容，都放置

19、在這一對(duì)標(biāo)簽中。body有一些常見的屬性格式為： bgcolor背景顏色text非鏈接文字的顏色link可鏈接文字的顏色alink擊活鏈接文字的顏色vlink訪問過的鏈接的顏色background在網(wǎng)頁中添加背景圖編寫注意事項(xiàng)編寫注意事項(xiàng)vHTML文件的標(biāo)記都是放在“”之間，而且大都數(shù)都是成對(duì)出現(xiàn)的。v標(biāo)記沒有大小寫之分。v標(biāo)記的屬性值可以利用“”，也可以不用。v在HTML文件中使用連續(xù)空白時(shí)，會(huì)自動(dòng)簡化為一個(gè)空白。v注釋以“”結(jié)束。常用的標(biāo)記常用的標(biāo)記v超鏈接標(biāo)記：語法：說明：href用來指出要鏈接的文件的名稱或URL。v圖片標(biāo)記：語法：常用屬性v段落標(biāo)記：語法：對(duì)齊方式有：left、cen

20、ter、rightv表格標(biāo)記：語法：常用屬性：v行標(biāo)記：語法：v單元格標(biāo)記:語法：常用屬性： 網(wǎng)頁設(shè)計(jì)語言 THML 網(wǎng)頁設(shè)計(jì)基礎(chǔ)語言 一、Dreamweaver概況一、功能和特點(diǎn)可視化的網(wǎng)頁編輯工具，特點(diǎn)：所見即所得；功能：網(wǎng)站管理、 網(wǎng)頁編輯二、界面組成1、插入面板網(wǎng)頁絕大多數(shù)內(nèi)容的添加都是通過插入面板來實(shí)現(xiàn)的。2、文檔工具欄視圖轉(zhuǎn)換按鈕、在瀏覽器中調(diào)試按鈕。3、使用狀態(tài)欄標(biāo)簽選擇器：可以準(zhǔn)確、快速地選定文檔中的內(nèi)容4、屬性面板每一個(gè)頁面中的元素，屬性面板的參數(shù)也不同。 二、站點(diǎn)的創(chuàng)建和管理二、站點(diǎn)的創(chuàng)建和管理一、定義一個(gè)本地站點(diǎn)定義本地站點(diǎn)，就是在硬盤上建立一個(gè)目錄，將所有的網(wǎng)頁和相關(guān)的

21、文件都放在里面，以便進(jìn)行網(wǎng)頁的制作和管理。重要作用：方便上傳 1.方法： a.建立一個(gè)新的目錄，將資料按照合理的原則（規(guī)劃網(wǎng)站目錄結(jié)構(gòu)的c、d、e）放到目錄里。 b.單擊“站點(diǎn)”菜單下的“新建站點(diǎn)”命令； c.彈出“定義站點(diǎn)”對(duì)話框； d.在“分類”列表中的選中第一項(xiàng)“本地信息”； e.在“站點(diǎn)名稱”框中輸入站點(diǎn)的名字；f. 選擇本地文件夾。 2.說明： a.選中“自動(dòng)刷新本地文件列表”，在向網(wǎng)站中復(fù)制文件的時(shí)候，網(wǎng)站文件列表會(huì)自動(dòng)刷新。 b.選中“啟用緩存”，為站點(diǎn)生成一個(gè)高速緩沖存文件，它可以加快以后檢查鏈接信息的速度。二、管理站點(diǎn) 1.新建文件/文件夾 2.修改文件名 3.刪除文件 4.

22、編輯網(wǎng)頁的內(nèi)容 提個(gè)醒： 在給文件起名時(shí)，區(qū)分大小寫，建議統(tǒng)一使用小寫的字母來命名。 創(chuàng)建新的網(wǎng)頁最好在站點(diǎn)面板中新建。文字處理文字處理一、文字的輸入和編輯1.連續(xù)空格中文全角2.段落- 換行 Shift+ 3.特殊字符代碼視圖,&二、文字屬性面板介紹1.段落光標(biāo)定位在段落中,格式、對(duì)齊2.文本選擇文本，字體、大小、顏色、鏈接3.列表 a、直接創(chuàng)建將光標(biāo)停在要插入列表的地方，單擊屬性面板的“編號(hào)列表”或“項(xiàng)目列表”；在結(jié)束列表的位置，連續(xù)輸入兩次回車或再次單擊該按鈕。 b.間接創(chuàng)建選中要成為列表的所有段落，單擊按鈕即可；取消的方法相同。 c.列表嵌套 選中要縮進(jìn)的項(xiàng)目或光標(biāo)移動(dòng)到要縮進(jìn)

23、的某一項(xiàng)列表中，單擊“文本縮進(jìn)”按鈕。 d.更改列表屬性 光標(biāo)移到要修改列表屬性的任一項(xiàng)中，點(diǎn)擊“列表屬性”按鈕，修改。絕大多數(shù)的網(wǎng)頁上使用的圖片是.gif、.jpg或.jpeg格式，也可以使用.png格式。一、普通圖像1、插入圖像a.單擊“插入面板”上的“圖像”按鈕；b.在“選擇圖像源”對(duì)話框中選擇要置入的圖片；c.出現(xiàn)“是否將圖片拷貝到本地文件夾下”的信息框時(shí)，單擊“是”；d.設(shè)置圖片文件保存的路徑。2、屬性面板圖像圖像3、改變大小a.拖動(dòng)圖像上的控制點(diǎn)；b.或在屬性面板上輸入圖像的尺寸。 c.恢復(fù)圖像的原始尺寸提個(gè)醒：可以對(duì)位圖進(jìn)行適當(dāng)?shù)姆糯?，但縮小圖像應(yīng)在圖像編輯軟件中縮小再加載到網(wǎng)頁

24、上，可以縮短網(wǎng)絡(luò)下載的時(shí)間。4、對(duì)齊與普通的文本對(duì)齊相比，增加了更多的對(duì)齊選擇，其中的左和右方式可以使圖文混合排列。5、制作圖像熱點(diǎn)區(qū)鏈接a.使用熱點(diǎn)工具在圖像上畫熱點(diǎn)區(qū)；b.選中熱點(diǎn)區(qū)，在屬性面板中設(shè)置鏈接。小竅門：刪除鏈接底線在超鏈接標(biāo)簽中插入onfocus=“if(this.blur)this.blur()” 二、插入輪轉(zhuǎn)圖 指鼠標(biāo)移上該圖時(shí)，顯示的變?yōu)榱硗庖环鶊D像，而鼠標(biāo)移開后，又恢復(fù)為原圖。 單擊“插入面板”上的“鼠標(biāo)經(jīng)過圖像”按鈕；其它步驟同插入圖像三、插入導(dǎo)航條 起導(dǎo)航作用，是以圖像做鏈接的。 a.單擊“插入面板”上的“導(dǎo)航條”按鈕； b.在“插入導(dǎo)航條”對(duì)話框中，添加第一個(gè)導(dǎo)

25、航按鈕； c.單擊加號(hào)按鈕，繼續(xù)添加。單擊向上和向下按鈕，調(diào)節(jié)導(dǎo)航按鈕間的順序。 四、插入動(dòng)畫 1、分類動(dòng)畫分為Flash制作的動(dòng)畫和Fireworks制作的Gif動(dòng)畫；2、方法a. Gif動(dòng)畫則和靜態(tài)的圖像的插入方法相同；b. Flash制作的動(dòng)畫，可通過插入面板的“插入Flash”按鈕，格式為：.swf。小竅門：設(shè)置動(dòng)畫背景透明在和中插入： 9、實(shí)例關(guān)于各種圖像的網(wǎng)頁超級(jí)鏈接超級(jí)鏈接一、概念： 是因特網(wǎng)最偉大的特性之一，可以實(shí)現(xiàn)在不同的URL之間跳轉(zhuǎn)。 超級(jí)鏈接由兩個(gè)端點(diǎn)（錨）組成，通常被稱為源端點(diǎn)或源錨，和目標(biāo)端點(diǎn)或目標(biāo)錨。超級(jí)鏈接就是實(shí)現(xiàn)源錨和目標(biāo)錨之間跳轉(zhuǎn)的橋梁。源錨可以是一段文本、

26、一幅圖像、圖像的熱區(qū)等；目標(biāo)錨可以是一個(gè)網(wǎng)頁、一幅圖像、一段聲音、一段程序、同一頁面的某一位置等。二、按目標(biāo)錨位置分類 1.外部鏈接：目標(biāo)錨是本站點(diǎn)之外的URL，這類鏈接通常跳轉(zhuǎn)到其它站點(diǎn)。 2.內(nèi)部鏈接：目標(biāo)錨是本站內(nèi)的文件。結(jié)論:外部鏈接用絕對(duì)地址(網(wǎng)址)表示；內(nèi)部鏈接用相對(duì)地址表示。 3.局部鏈接：也稱錨鏈，此類鏈接的目標(biāo)錨是某網(wǎng)頁文件的命名錨。錨點(diǎn)：當(dāng)網(wǎng)頁內(nèi)容很長時(shí)，為了查看方便，可以在要查看的地方加一個(gè)定位標(biāo)記，即是錨點(diǎn)。又分為內(nèi)部錨點(diǎn)和外部錨點(diǎn)。 定義錨點(diǎn)：“插入”面板的“命名錨記”按鈕；錨鏈地址的表示方法：#錨名 4.電子郵件鏈接：單擊電子郵件熱字或圖像時(shí)，可以直接打開郵件窗口，

27、并且收件人的E-mail地址會(huì)自動(dòng)添入。 建立電子郵件的方法：v圖像和文字：在屬性面板內(nèi)的“鏈接”域輸入： mailto:+E-mail地址v文字：單擊插入面板上的“插入電子郵件鏈接”設(shè)置。 5.無址鏈接：指產(chǎn)生鏈接不會(huì)跳轉(zhuǎn)到其它任何地方，只是使頁面產(chǎn)生一些變化。方法：在屬性面板內(nèi)的“鏈接”域輸入：#。6.腳本鏈接 ：執(zhí)行JavaScript代碼或函數(shù)。Javascript：alert（）；三、鏈接的目標(biāo)屬性“目標(biāo)”是用來設(shè)置目標(biāo)錨打開的位置。_blank：在一個(gè)空白窗口中打開；_self：在自身窗口中打開；四、設(shè)置鏈接文字的顏色文本：設(shè)置文檔中文字的顏色（黑）；鏈接：設(shè)置未訪問過超鏈接文字顏

28、色（藍(lán)）；訪問過的鏈接：設(shè)置文檔中已經(jīng)訪問過的超級(jí)鏈接的文字顏色（紫）；活動(dòng)鏈接：設(shè)置文檔頁面中正在訪問的超級(jí)鏈接的文字顏色（紅）。表格一、認(rèn)識(shí)表格二、表格的基本操作三、表格布局四、綜合實(shí)例主要內(nèi)容對(duì)網(wǎng)頁整體布局通常是通過表格來完成的。一.認(rèn)識(shí)表格 行(Row)、列(Column)、邊框(Border)是構(gòu)成表格的最基本元素。行高：某一行的高度，默認(rèn)是沒定義的；列寬：某一列的寬度；單元格填充：單元格中對(duì)象與邊框的距離；單元格間距：單元格之間的間距。二.表格的基本操作 1.插入表格2.選擇表格或單元格（1）整個(gè)表格: 單擊表格中任意的行與列； 在“標(biāo)簽選擇器”中選擇“Table”。 （2）一個(gè)單

29、元格: 在“標(biāo)簽選擇器”中選擇“Td”。 (3）多個(gè)單元格: 對(duì)于連續(xù)的單元格可以拖選；不連續(xù)的單元格用Ctrl鍵復(fù)選。 （4）一行列單元格: 將鼠標(biāo)移到一行的最左一列的最上面，出現(xiàn)黑色箭頭時(shí)單擊； 在“標(biāo)簽選擇器”中選擇。 （5）多行列單元格: 將鼠標(biāo)移到一行的最左一列的最上面，出現(xiàn)黑色箭頭時(shí)拖選； 用Ctrl鍵復(fù)選。3.設(shè)置表格屬性4.設(shè)置單元格屬性設(shè)置單元格中的元素在單元格中的對(duì)齊方式使用“水平”、“垂直”屬性；設(shè)置單元格同寬或高使用“寬”、“高”屬性；舉例：細(xì)線表格表格：“邊框”=0；“間距”=1；“背景色”=黑色單元格：“背景色”=白色突起表格在代碼視圖下為行標(biāo)簽添加屬性：borde

30、rcolorlight=#000000 bordercolordark=#FFFFFF虛線邊框設(shè)置表格的“邊框”=0；“間距”=0；“填充”=5；設(shè)置單元格的“背景圖”，“高度”=3；在代碼視圖下將單元格的“占位符”刪除。 5.在表格中插入對(duì)象 (1) 插入表格； (2) 插入圖象和文字；三、用表格布局網(wǎng)頁介紹：IE窗口內(nèi)能看到的第一屏部分為778px*435px 1.瀏覽器在下載完一個(gè)完整的表格后才顯示表格中的所有內(nèi)容，因此應(yīng)盡可能用多個(gè)獨(dú)立的表格來布局頁面（水平方向上是一個(gè)，垂直方向上是多個(gè)）。2.作為外層的布局整個(gè)頁面的表格以像素為單位（750-778/950-990），而里面的表格以%

31、為單位（95-100）。3.外層的布局表格若要設(shè)置對(duì)齊屬性，則都設(shè)置為統(tǒng)一的。一、層一、層（一）、認(rèn)識(shí)層層可以看作頁面內(nèi)容的容器，在層中可放置文本、圖象、對(duì)象插件、其它層等特性：浮動(dòng)；重疊；顯示、隱藏（二）、創(chuàng)建層1.插入層三種方法（連續(xù)繪制多個(gè)層：Ctrl）2.創(chuàng)建嵌套層(1) 將光標(biāo)移到現(xiàn)有層中；(2) 插入層（拖入）。 3.層屬性的設(shè)置(1)層的可見性 Default:大多數(shù)默認(rèn)為繼承父級(jí)元素的可見性；inherit:繼承父級(jí)的可見性；visible:顯示層及其中的內(nèi)容；hidden:隱藏層及其中的內(nèi)容。 (2)Z索引：在頁面垂直方向的索引值，來設(shè)置層的重疊次序。(3)超出設(shè)置：當(dāng)層中的

32、內(nèi)容超出了層范圍之外，會(huì)產(chǎn)生什么結(jié)果 visible:當(dāng)層中的內(nèi)容超出時(shí)層會(huì)自動(dòng)向右或向下沿伸；hidden:當(dāng)層中的內(nèi)容超出時(shí)，層的大小保持不變，也不出現(xiàn)滾動(dòng)條；scroll:無論層中的內(nèi)容是否超出，層的右和下端都會(huì)出現(xiàn)滾動(dòng)條； auto:當(dāng)層中的內(nèi)容超出時(shí)，層大小保持不變，但會(huì)出現(xiàn)滾動(dòng)條。 （三）、層管理器1.顯示層管理浮動(dòng)面板2.改變層名稱 方法：雙擊 3.創(chuàng)建嵌套層 方法：選中要作為子層的層；按住Ctrl鍵，將之拖到要作為父層的層頂上。4.設(shè)置層的可見性5.修改層的層疊次序表單表單 一、認(rèn)識(shí)表單表單是Internet用戶同服務(wù)器進(jìn)行信息交流最主要的工具之一?？梢允占脩糍Y料、獲取用戶定

33、單，也可以實(shí)現(xiàn)搜索接口等。一個(gè)完整的表單包括兩個(gè)組件：表單對(duì)象，在網(wǎng)頁中進(jìn)行描述；應(yīng)用程序，服務(wù)器端的應(yīng)用程序，客戶端的腳本表單可以認(rèn)為是裝載表單元素的容器。 1.文本框2.單選按鈕和復(fù)選框：3.列表菜單有菜單為下拉列表形式和列表為平鋪列表形式兩種。4.文件框：主要用于從磁盤上提取文件的路徑和名稱。5.圖象域：創(chuàng)建圖象類型的遞交按鈕，使網(wǎng)頁更美觀。6.按鈕：有三種類型提交、 復(fù)位、常規(guī)注意：一個(gè)表單必不可少的元素是：表單、按鈕，除跳轉(zhuǎn)菜單外。交互行為交互行為 可以通過在行為面板簡單的點(diǎn)擊，并設(shè)定相應(yīng)的參數(shù)來實(shí)現(xiàn)常見的交互行為。一、行為的基本元素1.事件：一個(gè)動(dòng)作的觸發(fā)器，在網(wǎng)絡(luò)上可以是用戶觸發(fā)

34、的，如：鼠標(biāo)的滑過、點(diǎn)擊等，也可以是自動(dòng)完成的，如：一個(gè)頁面的載入或關(guān)閉。2.對(duì)象：是事件的載體。3.動(dòng)作：則是一系列復(fù)雜的變化，可以是在狀態(tài)條顯示一條信息，或是復(fù)雜的翻轉(zhuǎn)效果，打開一個(gè)新窗口等，它是由javaScript代碼來實(shí)現(xiàn)其功能。二、添加行為的基本步驟1.選取一個(gè)特定的對(duì)象，最常見的是一個(gè)鏈接。行為將被加到此特定對(duì)象上。2.選擇希望的瀏覽器版本。（*）3.選擇一個(gè)希望執(zhí)行的動(dòng)作。4.為上述的動(dòng)作設(shè)定具體的參數(shù)。5.添加行為結(jié)束后，會(huì)自動(dòng)添加一個(gè)相應(yīng)的缺省事件，根據(jù)需要作相應(yīng)的修改。 廣告窗口彈出1、新建一個(gè)廣告頁面打開頁面屬性對(duì)話框。設(shè)置：外觀選項(xiàng)的“左邊距”、“上邊距：均為0像素；

35、在頁面中插入圖像，建立虛擬鏈接，目標(biāo)為：“_blank”。2.選擇主頁面單擊標(biāo)簽。在行為面板中選擇“打開瀏覽器窗口”命令。在“要顯示的URL”文本框中輸入廣告頁面文件，在窗口寬度和高度中輸入和圖片一樣大小數(shù)字。確定。廣告窗口自動(dòng)關(guān)閉1、打開廣告頁面。2、打開“腳本”編輯窗口：單擊“插入”/“HTML”/“腳本對(duì)象”/“腳本”。3、在窗口語言右邊的列表框中選擇“JavaScript”，在內(nèi)容右邊文本框中輸入： setTimeout(“self.close()”,10000) 10000即10000毫秒（10秒）4、確定。小貓例子1. 準(zhǔn)備操作：創(chuàng)建一個(gè)層，在該層嵌套2個(gè)小層，在2個(gè)小層上分別插入

36、2個(gè)小貓圖片，如圖，設(shè)置層3隱藏。2. 創(chuàng)作時(shí)間軸動(dòng)畫：層坐標(biāo)：左170層坐標(biāo)：左03. 在第一幀添加行為【停止時(shí)間軸 】4. 層2貓?jiān)O(shè)置空鏈接，添加【轉(zhuǎn)到時(shí)間軸幀】和【播放時(shí)間軸】5.在第15幀添加【顯示隱藏層】（層2隱藏，層3顯示）和【停止時(shí)間軸 】6.層2貓?jiān)O(shè)置空鏈接，添加【播放時(shí)間軸】7.在第15幀添加【顯示隱藏層】（層3隱藏，層2顯示）注意注意：為幀添加行為后，再向其它對(duì)象添加行為之前一定要先取消幀選擇，即單擊時(shí)間軸的其它位置CSS樣式一、基礎(chǔ)知識(shí)1.作用：不僅處理文本、鏈接、圖象和重新定義HTML標(biāo)識(shí)（body ,table ,td 等）2.特點(diǎn)： 結(jié)構(gòu)和格式分離； 常規(guī)方法達(dá)不到

37、的效果(行間距、字間距、行縮進(jìn)、修改項(xiàng)目編號(hào))； 減少了冗余代碼，使文件體積小 可以將多個(gè)網(wǎng)頁同時(shí)更新 3.控制方法傳統(tǒng)的頁面元素的控制方法是通過修改標(biāo)簽的屬性，這種控制能力非常有限。在CSS樣式中可以通過三種方式來控制頁面元素：一是重定義HTML標(biāo)簽，另外通過類和高級(jí)來控制。1標(biāo)簽選擇器標(biāo)簽選擇器是直接將HTML標(biāo)簽作為選擇器，用來定義這些標(biāo)簽采用的CSS樣式。 p color:red; font-size:18px; 2類選擇器可以將同一類型HTML標(biāo)簽定義出不同樣式。.redcolor:red; font-size:18px;.greencolor:green;font-size:16p

38、x; 類選擇器1 類選擇器23.Id選擇符ID選擇器和類選擇器的使用方法基本相同，不同之處在于ID選擇器只能在頁面中使用一次，因此其針對(duì)性更強(qiáng)。在HTML標(biāo)簽中只需要利用id屬性，就可以直接調(diào)用CSS中的ID選擇器。 #red font-size: 18px; color: red;#green font-size: 16px;color: green;ID選擇器1ID選擇器24.偽類選擇器是一種特殊的類，名稱不能被用戶自定義，使用時(shí)只能按照標(biāo)準(zhǔn)格式進(jìn)行應(yīng)用。偽類用于區(qū)別不同種類的元素。例如a：link（未訪問的鏈接）a：visited（訪問過的鏈接）等。 a:link color: red;

39、text-decoration: none;a:visited color: blue;鏈接二、創(chuàng)建新的CSS樣式1.新建CSS樣式a)在CSS管理器中單擊右鍵，選擇“新建CSS樣式”b)點(diǎn)擊右下角的“+”圖標(biāo)c)在“文本”菜單下，選擇“Css樣式”選項(xiàng)中的“新建CSS樣式” 2.類注意：類名不能以數(shù)字開頭，不能是保留的標(biāo)識(shí)名 例：自定義.biaoti類（字體：隸書；字號(hào)：6；顏色：紅；加粗）特點(diǎn):A)不會(huì)自動(dòng)應(yīng)用,必須選擇一個(gè)對(duì)象,在其屬性面板的”樣式”列表中選擇類應(yīng)用; B)在樣式管理器的列表中類名前面都有.C) 類會(huì)出現(xiàn)在標(biāo)簽選擇器應(yīng)用對(duì)象的標(biāo)簽后2.標(biāo)簽例：將網(wǎng)頁中的所有文字都顯示為：

40、宋體，9磅特點(diǎn):A)自動(dòng)應(yīng)用到該標(biāo)簽對(duì)應(yīng)的所有對(duì)象B)在樣式管理器的列表中是標(biāo)簽的名字C)樣式名不會(huì)出現(xiàn)在標(biāo)簽選擇器中3.高級(jí)用于定義文本鏈接的各種狀態(tài)顏色例：定義鏈接：所有狀態(tài)不帶下劃線；hover：位置變化特點(diǎn):A)自動(dòng)應(yīng)用到鏈接上B)在樣式管理器的列表中有:C)樣式不會(huì)出現(xiàn)在標(biāo)簽選擇器中三、新建CSS樣式表文件1.方法：新建：新建樣式表的同時(shí)新建樣式表文件鏈接：點(diǎn)擊樣式管理器右下的“附加樣式表”，彈出樣式編輯面板，選中要鏈接的外部樣式表文件，點(diǎn)擊“鏈接”按鈕。2.作用：當(dāng)修改樣式表文件，只要鏈接該樣式表文件的網(wǎng)頁都會(huì)隨之改變四、應(yīng)用CSS樣式1.類：出現(xiàn)在屬性面板的類列表中，先選擇頁面中

41、的對(duì)象，點(diǎn)擊樣式應(yīng)用。2.重定義標(biāo)識(shí)：直接應(yīng)用于網(wǎng)頁相應(yīng)的元素。3.高級(jí)：只對(duì)鏈接有效，直接應(yīng)用。五、樣式面板操作1.字體屬性是每個(gè)頁面中最基本的屬性，需要注意的是，并不僅僅是對(duì)單獨(dú)的文字定義字體屬性，幾乎所有的頁面元素都會(huì)涉及到字體定義，如定義表格需要涉及表格中的字體、定義列表需要涉及列表中的字體、定義表單需要涉及表單中的字體等。2.背景屬性通過這個(gè)對(duì)話框可以精確設(shè)定背景圖像的位置、是否重復(fù)顯示、是否隨頁面內(nèi)容滾動(dòng)。結(jié)論：希望讓該標(biāo)簽對(duì)應(yīng)的所有對(duì)象都應(yīng)用的樣式要定義為標(biāo)簽；若只希望少數(shù)對(duì)象應(yīng)用的樣式定義為類；鏈接樣式定義為高級(jí)。 3.文本塊屬性主要是定義段落的一些屬性值，如字符間距、文本對(duì)齊

42、、首行縮進(jìn)等。 4.容器屬性是樣式表中最重要的一個(gè)屬性類別，是實(shí)現(xiàn)頁面元素精確定位的基礎(chǔ)。 5.邊框?qū)傩允侨萜鞲拍钪械闹匾獌?nèi)容，可以設(shè)定容器四邊的邊框?qū)挾葦?shù)值、顏色及邊框樣式。 6.列表屬性可以對(duì)分級(jí)列表內(nèi)容進(jìn)行更多控制，如可以為列表指定一個(gè)單獨(dú)的圖片作為標(biāo)記。7.定位屬性是實(shí)現(xiàn)精確和自由定位的關(guān)鍵屬性，它給控制者更大的控制頁面的能力，而且還擴(kuò)展到三維的z軸方向。8.擴(kuò)充屬性是一些增強(qiáng)性的屬性，如設(shè)置模糊效果、下拉陰影等。a)模糊效果 blue(Direction=value,Strength=value)； Direction設(shè)定字體模糊的方向，以順時(shí)針的角度表示方向。 Strength設(shè)定

43、模糊的范圍，單位是像素。 b)下拉陰影vDropShadow(Color=#Value,OffX=value,Offy=Value,Positive=Value)v color設(shè)定陰影的顏色；v OffX指定陰影相對(duì)于元件在水平方向上的偏移量，值為正陰影在對(duì)象的右方，值為負(fù)則方向相反。v OffY指定陰影相對(duì)于元件在豎直方向上的偏移量。v Positive表示陰影的透明程度，取值為0時(shí)，沒有陰影，取值0時(shí)，顯示陰影。c)透明效果v格式：Alpha(Opacity=Value,Style=Value)vOpacity表示透明的程度，0為完全透明，100為完全不透明；vStyle表示漸進(jìn)的顯示形狀

44、，0為沒有漸進(jìn)，1為直線漸進(jìn)，2為圓形漸進(jìn)，3為矩形漸進(jìn)。 將CSS加入到HTML文檔中的方法1.放到文檔中： 2.寫在HTML的行內(nèi)： 藍(lán)色14號(hào)文字 3.編輯好的CSS文檔保存成“.CSS”文件，在中定義，一般是將文件鏈接進(jìn)網(wǎng)頁文件 在對(duì)象上應(yīng)用樣式的形式v類別選擇符對(duì)給定的類別應(yīng)用樣式例：.tiny font-size: 9px;定義在頁面上指定某一個(gè)元素，應(yīng)用類才能生效小字體應(yīng)用v標(biāo)簽選擇一個(gè)標(biāo)簽，在CSS樣式表中重新進(jìn)行定義，會(huì)自動(dòng)應(yīng)用相應(yīng)的元素上。例：bodyfont-size:12px 定義自動(dòng)應(yīng)用v高級(jí)定義的文字鏈接樣式例： A.linkcolor:green 定義自動(dòng)應(yīng)用vI

45、D選擇符 只能應(yīng)用于頁面中的一個(gè)唯一的元素上例：#content background: #FFF; 定義此處顯示內(nèi)容 應(yīng)用v群選擇符為多種對(duì)象應(yīng)用同一套樣式Div層+CSS樣式布局頁面一、一、DIV布局和TABLE布局的區(qū)別表格布局的代碼混亂，大量樣式代碼混雜在表表格布局的代碼混亂，大量樣式代碼混雜在表格，可讀性差，維護(hù)起來成本也相當(dāng)高；格，可讀性差，維護(hù)起來成本也相當(dāng)高；DIV布局的優(yōu)越性：1.比比table布局節(jié)省頁面代碼，代碼結(jié)構(gòu)也更清布局節(jié)省頁面代碼，代碼結(jié)構(gòu)也更清晰明了。晰明了。 2. 速度快速度快,能夠比能夠比table 更加快速的顯示網(wǎng)站內(nèi)更加快速的顯示網(wǎng)站內(nèi)容。容。 3. 使

46、網(wǎng)站版面布局修改變的更簡單使網(wǎng)站版面布局修改變的更簡單,因?yàn)榘婷娲驗(yàn)榘婷娲a都寫在獨(dú)立的碼都寫在獨(dú)立的css文件里。文件里。盒子模型v頁面中的所有元素都可以看作是一個(gè)盒子，一個(gè)頁面就是由很多的盒子組成，這些盒子之間能夠相互影響。 u由content（內(nèi) 容）、border（邊 框）、padding（填充）和margin（邊界）4部分組 成盒子的大小沒有設(shè)定width和height屬性所情況下 v寬度：會(huì)自動(dòng)延伸，直到父元素的內(nèi)容部分為限。 v高度：會(huì)自動(dòng)收縮，到能夠包容下內(nèi)容的最小高度。設(shè)置了width和height屬性的值u大?。簑eith（height）paddingbordermargin Margin的特殊情況（1）v塊元素間的豎直margin（塌陷）舉例：CSS代碼：div background-color: #999;padding: 10px;width: 100px;text-align: center;HTML代碼：塊元素1塊元素2 Margin的特殊情況（2）嵌套盒子之間的margin u正常情況u子塊超出了父塊的范圍不同瀏覽器處理的效果不一樣舉例：CSS代碼：#father background-color: #CCC;text-align: center;padding: 10px;border: 1px solid