第4章 CSS樣式表

1、第第4章章 CSS樣式表樣式表 第第4章章 CSS樣式表樣式表l CSS入門入門l CSS詳解詳解l 創(chuàng)建和應(yīng)用創(chuàng)建和應(yīng)用CSS開開 始始 CSS是Cascading Style Sheets（層疊樣式表）的簡稱。CSS的基本概念在于可將網(wǎng)頁要展示的內(nèi)容與樣式設(shè)定分開，也就是將網(wǎng)頁的外觀設(shè)定信息從網(wǎng)頁內(nèi)容獨立出來，并集中管理。這樣，當要改變網(wǎng)頁外觀時，只需更改樣式設(shè)定的部分，HTML文件本身并不需要更改。 本章主要內(nèi)容：本章主要內(nèi)容：第第4章章 CSS樣式表樣式表 4.1.1 “CSS樣式樣式”面板面板4.1.2 定義定義CSS樣式樣式4.1.3 在網(wǎng)頁中應(yīng)用在網(wǎng)頁中應(yīng)用CSS樣式樣式返回本章

2、首頁返回本章首頁4.1 CSS入門述入門述 CSS是W3C定義和維護的標準，是一種用來為結(jié)構(gòu)化文檔（如HTML文檔或XML應(yīng)用）添加樣式（字體、間距和顏色等）的計算機語言。它可以使網(wǎng)頁制作者的工作更加輕松和靈活，現(xiàn)在越來越多的網(wǎng)站采用了CSS技術(shù)。 第第4章章 CSS樣式表樣式表 4.1.1 “CSS樣式樣式”面板面板返回本節(jié)返回本節(jié) 在Dreamweaver中，“CSS樣式”面板是新建、編輯、管理CCS的主要工具。選擇“窗口”|“CSS樣式”命令可以打開或者關(guān)閉“CSS樣式”面板。 在沒有定義CSS前，“CSS樣式”面板是空白的。如果在Dreamweaver中定義了CSS，那么“CSS樣式”

3、面板中會顯示所定義好的CSS規(guī)則。 樣式表文件名CSS規(guī)則列表屬性和屬性值列表工具按鈕欄圖4-1 “CSS樣式”面板第第4章章 CSS樣式表樣式表 4.1.2 定義定義CSS樣式樣式返回本節(jié)返回本節(jié) 在【CSS樣式】面板上，單擊【新建CSS規(guī)則】按鈕，會打開如圖4-3所示的【新建CSS規(guī)則】對話框。 圖4-3 【新建CSS規(guī)則】對話框 1 1【定義在定義在】選項選項 【定義在】選項包括兩個單選項，分別介紹如下。 （1）【新建樣式表文件】：此選項將會把設(shè)定的樣式最終保存在一個外部單獨的樣式表文件中，這個樣式表文件可以被其他HTML文件共同使用，也就是說可以使站點內(nèi)的所有頁面文件使用同一個樣式表文

4、件，甚至不同的站點只要是網(wǎng)頁就可以使用。 （2）【僅對該文檔】：此選項將會把設(shè)定的樣式僅僅放在當前文件的頭文件中，這些樣式只能在此文件中使用。 專家點撥：專家點撥：根據(jù)運用CSS的范圍是局限于當前網(wǎng)頁內(nèi)部還是可以運用到其他網(wǎng)頁文件，可以分為“內(nèi)聯(lián)樣式表”和“外部樣式表”。“內(nèi)聯(lián)樣式表”是將CSS規(guī)則定義在HTML網(wǎng)頁文檔內(nèi)部。 “外部樣式表”是將CSS規(guī)則定義在一個獨立的外部樣式表文件（擴展名為.css）中。 第第4章章 CSS樣式表樣式表 4.1.2 定義定義CSS樣式樣式返回本節(jié)返回本節(jié) 【選擇器類型】選項包括3個單選項，分別介紹如下。 （1）【類（可應(yīng)用于任何標簽）】：選擇此類型后，需要

5、在上方的【名稱】文本框中填入一個樣式名字，需要注意的是，此類名稱必須以“.”開頭。這種方式定義的樣式可以用來定義絕大多數(shù)的HTML對象，可以使這些對象有統(tǒng)一的外觀。如圖4-4所示是創(chuàng)建一個.mystyle的樣式。圖4-4 創(chuàng)建mystyle樣式 第第4章章 CSS樣式表樣式表 4.1.2 定義定義CSS樣式樣式返回本節(jié)返回本節(jié) 專家點撥：專家點撥：如果在【定義在】選項中選擇的是【新建樣式表文件】，那么單擊【確定】按鈕后會彈出【保存樣式表文件為】對話框，在其中選擇要保存到的目錄，輸入文件名，單擊【保存】按鈕后進入【.mystyle的CSS規(guī)則定義】對話框。在其中可以定義【類型】、【背景】、【區(qū)塊

6、】、【方框】、【邊框】、【列表】、【定位】、【擴展】等屬性。 （2）【標簽（重新定義特定標簽的外觀）】：選擇此選項后，在【標簽】下拉框里選擇需要重新定義的HTML標簽。 （3）【高級（ID、偽類選擇器等）】：重新定義特定元素組合的格式，或其他CSS允許的選擇器表單的格式（例如，每當h2標題出現(xiàn)在表格單元格內(nèi)時，就會應(yīng)用選擇器td h2）。還可以重定義包含特定id屬性的標簽的格式（例如，由#myStyle定義的樣式可以應(yīng)用于所有包含屬性/值對id=myStyle的HTML標簽）。另外，這個選項還可以設(shè)定鏈接文本的樣式。 第第4章章 CSS樣式表樣式表 返回本節(jié)返回本節(jié) 定義完樣式表文件后，就可以

7、在Dreamweaver中套用這些樣式了。套用樣式表的方法主要有3種，下面分別進行介紹。 1 1在在【屬性屬性】面板選擇應(yīng)用樣式面板選擇應(yīng)用樣式 在網(wǎng)頁中選中需要應(yīng)用樣式的元素，打開【屬性】面板，單擊打開【樣式】右邊的下拉列表框，里面列出了已經(jīng)定義的一些CSS樣式。如圖4-8所示。4.1.3 在網(wǎng)頁中應(yīng)用在網(wǎng)頁中應(yīng)用CSS樣式樣式圖4-8 【屬性】面板中的“樣式”列表框 2 2利用利用【標簽選擇器標簽選擇器】選擇樣式選擇樣式 首先需要在【標簽選擇器】上選定一個標簽，如圖4-9中的標簽，然后在標簽上右擊，在彈出的快捷菜單中選擇【設(shè)置類】|【mycss】，則可以快速把已經(jīng)定義的mycss樣式類指定

8、給標簽。 圖4-9 利用【標簽選擇器】應(yīng)用樣式 第第4章章 CSS樣式表樣式表 返回本節(jié)返回本節(jié) 3 3使用右鍵快捷菜單使用右鍵快捷菜單也可以從右鍵快捷菜單中直接給對象指定一個樣式，首先選中需要應(yīng)用樣式的對象，在右鍵快捷菜單中指定樣式類。如圖4-10所示。 4.1.3 在網(wǎng)頁中應(yīng)用在網(wǎng)頁中應(yīng)用CSS樣式樣式圖4-10 從右鍵快捷菜單中直接給對象指定樣式 4 4清除樣式清除樣式 如果想清除應(yīng)用的樣式，首先選中對象，然后從右鍵快捷菜單中選擇“無”，即可清除原有的樣式。需要提醒注意的是，這里的清除樣式并不是將定義的樣式完全刪除，而是網(wǎng)頁中的某個對象不再使用這個樣式了。 第第4章章 CSS樣式表樣式表

9、 返回本章首頁返回本章首頁4.2 CSS樣式詳解樣式詳解 在Dreamweaver的CSS樣式里包含了W3C規(guī)范定義的所有CSS1的屬性，Dreamweaver把這些屬性分為Type（類型）、Background（背景）、Block（塊）、Box（盒子）、Border（邊框）、List（列表）、Positioning（定位）、Extensions（擴展）8個部分，如圖4-11所示。 圖4-11 CSS規(guī)則定義 4.2.1 4.2.1 類型類型4.2.2 4.2.2 背景背景4.2.3 4.2.3 區(qū)塊區(qū)塊4.2.4 4.2.4 方框方框4.2.5 4.2.5 邊框邊框4.2.6 4.2.6 列

10、表列表4.2.7 4.2.7 定位定位4.2.8 4.2.8 擴展擴展第第4章章 CSS樣式表樣式表 4.2.1 類型類型返回本節(jié)返回本節(jié) 類型選項主要是對文字的字體大小、顏色、效果等基本樣式進行設(shè)置，如圖4-11所示。只對要改變的屬性進行設(shè)置，沒有必要改變的屬性就使之為空。 1 1字體字體 字體系列是指對文字設(shè)定幾個字體，當遇到第一個字體不能顯示時會自動用系列中的第二個字體或后面的字體顯示。相對應(yīng)的CSS屬性是font-family。 大小大小 可以通過選取數(shù)字和度量單位來選擇具體的字體大小，或者也可以選擇一個相對的字體大小。最好使用像素作為單位，這樣不會在瀏覽器中文本變形。一般小字體用比較

11、標準的12像素。相對應(yīng)的CSS屬性是font-size。 3 3樣式樣式 定義字體樣式為“正?！?、“斜體”或“偏斜體”。默認設(shè)置為正常。相對應(yīng)的CSS屬性是font-style。“斜體”和“偏斜體”都是斜體字體。而它們不同的是，“斜體”是斜體字，而“偏斜體”是傾斜的文字，對于沒有斜體的字體應(yīng)該用“偏斜體”。 4 4行高行高 設(shè)置文本所在行的行高。默認為正常，也可以自己鍵入一個精確的數(shù)值并選取一個計量單位。比較直觀的寫法用百分比，例如140%是指行高等于文字大小的1.4倍。相對應(yīng)CSS屬性是line-height。 5 5修飾修飾向文本中添加下劃線、上劃線或刪除線，或使文本閃爍。常規(guī)文本的默認設(shè)

12、置是“無”。鏈接的默認設(shè)置是“下劃線”。將鏈接設(shè)置設(shè)為無時，可以通過定義一個特殊的類去除鏈接中的下劃線。這些效果可以同時存在，將效果前的復(fù)選框選定即可。相對應(yīng)的CSS屬性是text-decoration。 第第4章章 CSS樣式表樣式表 4.2.1 類型類型返回本節(jié)返回本節(jié) 6粗細粗細 對字體應(yīng)用特定或相對的粗體量?！罢！钡扔?00；“粗體”等于700。相對應(yīng)的CSS屬性是font-weight。 7變體變體 設(shè)置文本的小型大寫字母變體。Dreamweaver不在“文檔編輯區(qū)”中顯示此屬性。Internet Explorer支持變體屬性，但Navigator不支持。相對應(yīng)的CSS屬性是fon

13、t-variant。 8大小寫大小寫 將選區(qū)中每個單詞的第一個字母轉(zhuǎn)為大寫，或者令單詞全部大寫或全部小寫。相對應(yīng)的CSS屬性是 text-transform。 9顏色顏色 定義文字顏色。相對應(yīng)的CSS屬性是color。CSS中顏色的值有3種表示方法。 #RRGGBB格式，是由紅綠藍三種顏色的值組合，每種顏色的值為“00FF”的兩位十六進制正整數(shù)。例如，#FF0000表示紅色，#FFFF00表示黃色。 RGB格式，RGB為三色的值，取0255，例如，RGB（255,0,0）表示紅色，RGB（255,255,0）表示黃色。 用顏色名稱。CSS可以使用已經(jīng)定義好的顏色名稱。例如，red表示紅色，ye

14、llow表示黃色。 第第4章章 CSS樣式表樣式表 4.2.2 背景背景返回本節(jié)返回本節(jié) 背景選項主要是對元素的背景進行設(shè)置，包括背景顏色、背景圖像、背景圖像的控制。如圖4-12所示。一般是對BODY（頁面）、TABLE（表格）、DIV（區(qū)域）的設(shè)置。圖4-12 背景選項 1 1背景顏色背景顏色 設(shè)置元素的背景色。相對應(yīng)的CSS屬性是background-color?？梢詥螕簟邦伾卑粹o打開調(diào)色板，然后在其中選擇需要的顏色?；蛘咧苯釉谖谋究蛑休斎腩伾a。 2 2背景圖像背景圖像 設(shè)置元素的背景圖像。相對應(yīng)的CSS屬性是background-image?？梢詥螕簟盀g覽”按鈕打開“選擇圖像源文件

15、”對話框，在其中選擇需要的圖像文件?；蛘咧苯釉谖谋究蛑休斎雸D像文件的完整路徑。 第第4章章 CSS樣式表樣式表 4.2.2 背景背景返回本節(jié)返回本節(jié) 3 3重復(fù)重復(fù) 確定背景圖像是否以及如何重復(fù)。相對應(yīng)的CSS屬性是background-repeat。在下拉列表中包括4個選項。 不重復(fù)：在元素的開頭顯示一遍圖像。 重復(fù)：在元素的背景部分水平和垂直方向平鋪圖像。 橫向重復(fù)：在水平和垂直方向重復(fù)顯示。 縱向重復(fù)：在垂直方向重復(fù)顯示。 4 4附件附件 確定背景圖像是固定在其原始位置還是隨內(nèi)容一起滾動。注意，某些瀏覽器可能將“固定”選項視為“滾動”。Internet Explorer支持該選項，但Ne

16、tscape Navigator不支持。相對應(yīng)的CSS屬性是background-attachment。 5 5水平位置水平位置 指定背景圖像相對于元素的水平位置。相對應(yīng)的CSS屬性是background-position。在下拉列表中可以指定為left（左邊），center（居中），right（右邊）；也可以在文本框中直接輸入數(shù)值，如20px是指背景距離左邊20象素。 6 6垂直位置垂直位置 指定背景圖像相對于元素的垂直位置。相對應(yīng)的CSS屬性是background-position。在下拉列表中可以指定為top（頂部），center（居中），bottom（底部）；也可以在文本框中直接輸入數(shù)

17、值。 第第4章章 CSS樣式表樣式表 4.2.3 區(qū)塊區(qū)塊返回本節(jié)返回本節(jié) 區(qū)塊選項主要是設(shè)置對象文本文字間距、對齊方式、上標、下標、排列方式、首行縮進等。如圖4-13所示。圖4-13 區(qū)塊選項 第第4章章 CSS樣式表樣式表 4.2.3 區(qū)塊區(qū)塊返回本節(jié)返回本節(jié) 區(qū)塊選項主要是設(shè)置對象文本文字間距、對齊方式、上標、下標、排列方式、首行縮進等。如圖4-13所示。 1 1單詞間距單詞間距設(shè)置單詞之間的間距。若要設(shè)置特定的值，請在下拉列表中選擇“值”，然后輸入一個數(shù)值。在第二個下拉列表中選擇度量單位（例如像素、點等）。相對應(yīng)的CSS屬性是word-spacing?？梢灾付ㄘ撝?，但顯示方式取決于瀏覽

18、器。Dreamweaver不在“文檔”窗口中顯示此屬性。 2 2字母間距字母間距設(shè)置字符之間的間距?？梢灾付ㄘ撝?。因為中文也是字符，這個參數(shù)可以設(shè)置文字間的間距。相對應(yīng)的CSS屬性是letter-spacing。 3 3垂直對齊垂直對齊指定元素的垂直對齊方式?？梢灾付╯ub（下標）、super上標）、top（與頂端對齊）、middle（居中）、bottom（與底端對齊）等。相對應(yīng)的CSS屬性是vertical-align。第第4章章 CSS樣式表樣式表 4.2.3 區(qū)塊區(qū)塊返回本節(jié)返回本節(jié) 4 4文本對齊文本對齊 設(shè)置文本的排列方式。下拉列表中包括Left（左對齊）、right（右對齊）、ce

19、nter（居中）、justify（兩端對齊）。相對應(yīng)的CSS屬性是text-align。 5 5文本縮進文本縮進 設(shè)置文本第一行的縮進值。負值用于將文本第一行向外拉。要在每段前空兩格，可設(shè)置為2em，因為em是當前字體尺寸，2em就是兩個字的大小。相對應(yīng)的CSS屬性是text-indent。 6 6空格空格 設(shè)置如何處理元素內(nèi)的空白符。相對應(yīng)的CSS屬性是white-space。下拉列表中包括“正?！?、“保留”和“不換行”3個選項?！罢！保簳⒖瞻追繅嚎s；“保留”：如同處理pre標簽內(nèi)的文本一樣處理這些空白符（也就是說，所有的空白符，包括空格，標簽，回車，等都會得以保留）；“不換行”：指

20、定文本只有遇到br標簽時才換行。 7 7顯示顯示 指定是否以及如何顯示元素?！盁o”指定到某個元素時，它將禁用該元素的顯示。 第第4章章 CSS樣式表樣式表 4.2.4 方框方框返回本節(jié)返回本節(jié) 方框選項主要設(shè)置對象的邊界、間距、高度、寬度、和漂浮方式等。如圖4-14所示。 圖4-14 方框選項第第4章章 CSS樣式表樣式表 4.2.4 方框方框返回本節(jié)返回本節(jié) 1 1寬寬 定義元素的寬。相對應(yīng)的CSS屬性是width。在下拉列表中包括自動和值兩個選項。 選擇“值”這個選項后，可以在文本框中輸入具體的數(shù)值，并且再后面的下拉列表中選擇一個單位。 2 2高高 定義元素的高。相對應(yīng)的CSS屬性是hei

21、ght。在下拉列表中包括自動和值兩個選項。 選擇“值”這個選項后，可以在文本框中輸入具體的數(shù)值，并且再后面的下拉列表中選擇一個單位。 3 3浮動浮動 定義元素的漂浮方式。下拉列表中包括左對齊、右對齊和無。相對應(yīng)的CSS屬性是float。 第第4章章 CSS樣式表樣式表 4.2.4 方框方框返回本節(jié)返回本節(jié) 4 4清除清除 定義不允許AP元素的邊。如果清除邊上出現(xiàn)AP元素，則帶清除設(shè)置的元素將移到該元素的下方。相對應(yīng)的CSS屬性是clear。 5 5填充填充定義元素內(nèi)容與其邊框的空距（如果元素沒有邊框就是指頁邊的空白）?？梢苑謩e設(shè)置top（上補白）、right（右補白）、bottom（下補白）、

22、left（左補白）的值。相對應(yīng)的CSS屬性分別是padding-top、 padding-right、padding-bottom、padding-left。如果勾選“全部相同”復(fù)選框，則為應(yīng)用此屬性的元素的“上”、“右”、“下”和“左”設(shè)置相同的填充屬性。 6 6邊界邊界 定義元素的邊框與其他元素之間的距離（如果沒有邊框就是指內(nèi)容之間的距離）。可以分別設(shè)置top（上邊界）、right（右邊界）、bottom（下邊界）、left（左邊界）的值。相對應(yīng)的CSS屬性分別是margin-top、margin-right、 margin-bottom、margin-left。如果勾選“全部相同”復(fù)選框

23、，則為應(yīng)用此屬性的元素的“上”、“右”、“下”和“左”設(shè)置相同的邊界屬性。 第第4章章 CSS樣式表樣式表 4.2.5 邊框邊框返回本節(jié)返回本節(jié)邊框選項可以設(shè)置對象邊框的寬度、顏色及樣式。如圖4-15所示。圖4-15 邊框選項 1 1樣式樣式 設(shè)置邊框樣式?？梢栽O(shè)置為none（無邊框）、dotted（點劃線）、dashed（虛線）、solid（實線）、double（雙線）、groove（槽狀）、ridge（脊狀）、inset（凹陷）、outset（凸出）等邊框樣式。相對應(yīng)的CSS屬性是border-style。 專家點撥：專家點撥：dotted（點劃線）、dashed（虛線）必須要IE5.5以

24、上或者MAC平臺支持，否則效果為實線。如果勾選“全部相同”復(fù)選框，為應(yīng)用此屬性的元素的“上”、“右”、“下”和“左”設(shè)置相同的邊框樣式屬性。 第第4章章 CSS樣式表樣式表 4.2.5 邊框邊框返回本節(jié)返回本節(jié) 2 2寬度寬度 設(shè)置元素邊的寬度。可以分別設(shè)定Top（上邊寬）、Right（右邊寬）、Bottom（下邊寬）、Left（左邊寬）的值。相對應(yīng)的CSS屬性分別是border-top、border-right、border-bottom、border-left。如果勾選“全部相同”復(fù)選框，為應(yīng)用此屬性的元素的“上”、“右”、“下”和“左”設(shè)置相同的邊框?qū)挾葘傩浴?3 3顏色顏色 設(shè)置邊框的

25、顏色?？梢苑謩e對每條邊設(shè)置顏色。相對應(yīng)的CSS屬性分別是border-top-color、border-right-color、 border-bottom-color、border-left-color?？梢酝ㄟ^設(shè)置不同的顏色做出亮邊和暗邊的效果，這樣元素看起來是立體的。如果勾選“全部相同”復(fù)選框，為應(yīng)用此屬性的元素的“上”、“右”、“下”和“左”設(shè)置相同的邊框顏色屬性。 第第4章章 CSS樣式表樣式表 4.2.6 列表列表返回本節(jié)返回本節(jié) 列表選項可以設(shè)置列表項樣式、列表項圖片和位置。如圖4-16所示。圖4-16 列表選項 1 1類型類型 設(shè)置列表項所使用的預(yù)設(shè)標記?？梢栽O(shè)置的樣式有：di

26、sc（實心圓）、circle（空心圓）、square（方塊）、decimal（阿拉伯數(shù)字）、lower-roman（小寫羅馬數(shù)字）、upper-roman（大寫羅馬數(shù)字）、lower-alpha（小寫英文字母）、upper-alpha（大寫英文字母）、none（無項目符號）。相對應(yīng)的CSS屬性是list-style-type。 第第4章章 CSS樣式表樣式表 4.2.6 列表列表返回本節(jié)返回本節(jié) 2 2項目符號圖像項目符號圖像 設(shè)置列表項的圖像。相對應(yīng)CSS屬性是list-style-image?？梢栽谖谋究蛑兄苯虞斎雸D像URL地址或路徑?；蛘邌螕簟盀g覽”按鈕，在彈出的“選項圖像源文件”對話框

27、中選擇需要的圖像文件。 3 3位置位置 設(shè)置列表項在文本內(nèi)還是在文本外。相對應(yīng)的CSS屬性是list-style-position。下拉列表中包括兩個選項。 內(nèi)：列表項目標記放置在文本以內(nèi)。 外：列表項目標記放置在文本以外。 第第4章章 CSS樣式表樣式表 4.2.7 定位定位返回本節(jié)返回本節(jié) 定位選項中的CSS屬性用來確定與選定的CSS樣式相關(guān)的內(nèi)容在頁面上的定位方式。如圖4-17所示。這就相當于對象放在一個AP元素里來定位，它相當于HTML的DIV標記?？梢园讯x看作為一個CSS定義的AP元素。 圖4-17 定位選項第第4章章 CSS樣式表樣式表 4.2.7 定位定位返回本節(jié)返回本節(jié) 1

28、1類型類型 設(shè)定對象的定位方式。相對應(yīng)的CSS屬性是position。有4種方式可供選擇，如下所述。 絕對：使用“定位”文本框中輸入的、相對于最近的絕對或相對定位上級元素的坐標（如果不存在絕對或相對定位的上級元素，則為相對于頁面左上角的坐標）來放置內(nèi)容。 相對：使用“定位”文本框中輸入的、相對于區(qū)塊在文檔文本流中的位置的坐標來放置內(nèi)容區(qū)塊。例如，若為元素指定一個相對位置，并且其上坐標和左坐標均為20px，則將元素從其在文本流中的正常位置向右和向下移動20px。也可以在使用（或不使用）上坐標、左坐標、右坐標或下坐標的情況下對元素進行相對定位，以便為絕對定位的子元素創(chuàng)建一個上下文。 固定：使用“定

29、位”文本框中輸入的坐標（相對于瀏覽器的左上角）來放置內(nèi)容。當用戶滾動頁面時，內(nèi)容將在此位置保持固定。靜態(tài)：將內(nèi)容放在其在文本流中的位置。這是所有可定位的HTML元素的默認位置。 第第4章章 CSS樣式表樣式表 4.2.7 定位定位返回本節(jié)返回本節(jié) 2 2顯示顯示 確定內(nèi)容的初始顯示條件。相對應(yīng)的CSS屬性是visibility。如果不指定“顯示”屬性，則默認情況下內(nèi)容將繼承父級標簽的值。body標簽的默認可見性是可見的?！帮@示”下拉列表中包括3個選項。繼承（默認）：繼承內(nèi)容的父級可見性屬性。可見：將顯示內(nèi)容，而與父級的值無關(guān)。隱藏：將隱藏內(nèi)容，而與父級的值無關(guān)。 3 3Z Z 軸軸確定內(nèi)容的堆

30、疊順序。Z軸值較高的元素顯示在Z軸值較低的元素（或根本沒有Z 軸值的元素）的上方。值可以為正，也可以為負。 4 4溢出溢出 確定當容器（如DIV或P）的內(nèi)容超出容器的顯示范圍時的處理方式?！耙绯觥毕吕斜碇邪?個選項。 可見：將增加容器的大小，以使其所有內(nèi)容都可見。容器將向右下方擴展。 隱藏：保持容器的大小并剪輯任何超出的內(nèi)容。不提供任何滾動條。 滾動：將在容器中添加滾動條，而不論內(nèi)容是否超出容器的大小。明確提供滾動條可避免滾動條在動態(tài)環(huán)境中出現(xiàn)和消失所引起的混亂。 自動：將使?jié)L動條僅在容器的內(nèi)容超出容器的邊界時才出現(xiàn)。第第4章章 CSS樣式表樣式表 4.2.7 定位定位返回本節(jié)返回本節(jié) 5 5定位定位 指定內(nèi)容塊的位置和大小，包括上、下、左、右4個選項。瀏覽器如何解釋位置取決于“類型”設(shè)置。如果內(nèi)容塊的內(nèi)容超出指定的大小，則將改寫大小值。 位置和大小的默認單位是像素。還可以指定以下單位：pc（皮卡）、pt（點）、in（英寸）、mm（毫米）、cm（厘米）、em（全方）、（ex）或%（父級值的百分比）。單位縮寫字母必須緊跟在值之后，中間不留空格。例如，3mm 。 6 6剪輯剪輯 定義內(nèi)容的可見部分，包括上、下、左、右4個選項。如果指定了剪輯區(qū)域，可以通過腳本語言（如JavaScri