【正文】 CSS滾動條– Ex: ?scrollbararrowcolor: 按鈕上箭頭的顏色?scrollbarfacecolor: 按鈕的顏色?scrollbarhighlightcolor: 按鈕左上邊框顏色?scrollbar3dlightcolor: 按鈕左上邊框顏色?scrollbardarkshadowcolor: 按鈕右上邊框顏色?scrollbartrackcolor: 卷動凹槽的顏色?scrollbarshadowcolor: 陰影顏色滾動條設(shè)置96Inter與網(wǎng)頁設(shè)計 CSS樣式表樣式表 ?720px150px50px500px150px560px275px 245px97Inter與網(wǎng)頁設(shè)計 CSS樣式表樣式表 ?。text: 文字編輯輸入時的光標， I形252。move: 移動時的光標 ，十字箭頭252。crosshair: 十字型252。auto: 自動設(shè)定252。seresize: 向右下的箭頭252。neresize: 向右上的箭頭252。nresize: 向上的箭頭252。wresize: 向左的箭頭252?！瓆/style 94Inter與網(wǎng)頁設(shè)計 CSS樣式表樣式表 ?252。 top:1em。}:hover span { display:block。}/stylestyle type=“text/css” { position: relative。….. background: 94B8E9 url(images/) norepeat left top。CSS工具提示 (tooltip)– 使用 span標簽界定提示文本– 對 span應(yīng)用樣式– Ex: style type=“text/css”li a { display: block。}/style93Inter與網(wǎng)頁設(shè)計 CSS樣式表樣式表 ?鏈接特效252。}a:hover, a:active { backgroundimage: url(images/)。創(chuàng)建按鈕效果的鏈接– 使用 display屬性將鏈接顯示為塊級元素，然后應(yīng)用背景，這樣點擊塊中任意位置都會觸發(fā)鏈接– Ex: ， style type=“text/css”a:link, a:visited { textdecoration: none。533252。} a:link, a:visited {textdecoration: none。}a:hover, a:active {textdecoration:underline。a:active 在鏈接上按下鼠標時的狀態(tài)252。 訪問過的鏈接– 能清楚的判斷已經(jīng)訪問過的鏈接252。這種鏈接狀態(tài)是基本的252。 沒有接觸過的鏈接– 用于定義了鏈接的常規(guī)狀態(tài)。在 CSS樣式中，定義鏈接的各種狀態(tài)252。為了使背景能隨正文的大小自動延伸，需要使用偽列技術(shù)– 固定寬度的偽列? 創(chuàng)建背景圖案條，然后設(shè)置成 “縱向平鋪 ”（ repeaty）? Ex:– 可變寬度的偽列? 要使用背景圖像的百分比定位方法? Ex:background: fff url(images/) repeaty left top。混合布局– 可以組合流式布局與彈性布局，以 em設(shè)置寬度，以百分比設(shè)置最大寬度– 在極端情況下都可以有較好的整體效果– Ex:89Inter與網(wǎng)頁設(shè)計 CSS樣式表樣式表 ?偽列 (Faux)252。流式布局– 寬度用百分數(shù)進行設(shè)置– 使整體布局隨瀏覽器窗口的伸縮而伸縮– Ex:252。兩列浮動布局– Ex： 252。 marginleft: 360px。 left: 50%。 textalign: left。單列居中設(shè)計，是最基礎(chǔ)的布局方式– 可以使用自動空白邊方法， Ex: centeringauto– 可以使用相對定位和負空白邊方法， Ex：style type=“text/css”wrapper { width: 720px。CSS布局技術(shù)都基于三個基本概念：定位、浮動和空白邊操縱252。ZINDEX－ 設(shè)置層疊順序?當(dāng)定位多個元素并將它們相互重疊時，可以使用該屬性設(shè)置元素在 Z軸的層疊順序zindex : number ?屬性值越大表示在越上層?這邊填入的數(shù)字沒有單位style type=“text/css”style1 { zindex:100 }/style85Inter與網(wǎng)頁設(shè)計 CSS樣式表樣式表 ?CSS中的布局252。clear:both。是不一樣的– 后者為隱藏的對象保留其占據(jù)的物理空間，而 前者則不保留252。display=none。VISIBILITY－ 設(shè)置對象是否可見? 定義這個層級是不是要在畫面上顯示出功能來，最常利用java script來動態(tài)控制某個層級的顯示狀況，進而達到動態(tài)的效果? 默認值是 visible，不顯示則設(shè)定成 hidden252。 }/style252。bottom:10px。}/styleEx: 82Inter與網(wǎng)頁設(shè)計 CSS樣式表樣式表 ?CSS定位與顯示252。 margin: 0。}.news p { float: right。}.news img { float: left。 border: solid 1px 999。移到了浮動框的下面，容器元素得到延伸，包含了浮動元素style type=text/css.clear { clear: both。如果要為浮動元素留出垂直空間，使其它的元素不在其兩側(cè)顯示，可以 對其周圍的元素 使用清理屬性clear : none | left |right | both– 添加了 clear屬性的元素，通過自動增加空白邊，達到留出垂直空間的效果81Inter與網(wǎng)頁設(shè)計 CSS樣式表樣式表 ?Clear屬性252。}/style79Inter與網(wǎng)頁設(shè)計 CSS樣式表樣式表 ?浮動 如果水平位置沒有空間了，則 box3會跑到下面去如果 box2的高度沒有box1高度大， box1減去box2的高度的部分會把box3攔住80Inter與網(wǎng)頁設(shè)計 CSS樣式表樣式表 ?252。top:20px }/styleEx: 77Inter與網(wǎng)頁設(shè)計 CSS樣式表樣式表 ?浮動 浮動框可以左右移動，直到它的外邊緣碰到包含框或另一浮動框的邊緣252。top:20px }/stylestyle type=“text/css”style1 {position:fixed。是絕對定位的一個特殊情況– 與絕對定位相似，唯一不同的是絕對定位是相對于父元素的某一個位置，而固定定位則是固定在瀏覽器的視框位置– 這樣當(dāng)窗口滾動時，固定定位的元素不會隨之滾動，總是出現(xiàn)在屏幕的固定位置 style type=“text/css”style1 {position:absolute。top:20px }/styleEx: CSS樣式表樣式表 ?絕對定位 529 252。另外，移動元素可能導(dǎo)致覆蓋其它元素style type=“text/css”style1 {position: relative。相對于元素在普通文本流中的初始位置– 如果一個元素進行相對定位，它將以它所在的位置 (即 它在普通流中的位置 )為初始點，然后，可以通過設(shè)置垂直或水平位置，讓這個元素 “相對于 ”它的初始點進行移動 252。按照元素的類型和在 HTML源文件中的出現(xiàn)順序進行定位– 就是 block元素（如 p、 h、 div）（ 塊級框）從上到下一個接一個的排列– inline元素（如 span、 strong元素）在行中水平布置252。與定位相關(guān)的屬性主要有 14個252。CSS中有三種基本的定位機制– 普通流：顯示的位置由元素在 HTML文件中的位置決定– 浮動：可以左右移動，直到碰到包含框或其它浮動框– 絕對定位：可以直接將元素定位在頁面上地任何位置252。CSS的定位與顯示屬性可以把一個 HTML元素定位在網(wǎng)頁中的任何位置252。}p { border: thick double yellow。 }style2 {borderwidth: 1px thin 5px thick?；蚴褂靡粋€復(fù)合屬性設(shè)置所有屬性值：border : borderwidth borderstyle bordercolorstyle type=“text/css”style1 {borderbottom: 25px solid red。}/styleBox Model73Inter與網(wǎng)頁設(shè)計 CSS樣式表樣式表 ?– borderwidth : medium | thin | thick | length? 設(shè)置各個邊框的寬度?也可以分別用四個屬性： bordertopwidth，borderrightwidth， borderbottomwidth，borderleftwidth252。}style3 { bordertopcolor :blue。BORDER－ 對于邊界的設(shè)置，包括寬度、顏色、線條樣式三種，使用方法相同：– bordercolor : 顏色值列表?設(shè)置各個邊框的顏色，設(shè)置順序和margin一樣?也可以分別用四個屬性： bordertopcolor， borderbottomcolor， borderrightcolor， borderleftcolor– borderstyle : none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset?設(shè)置各個邊框的線條樣式?也可以分別用四個屬性： bordertopstyle， borderbottomstyle， borderleftstyle， borderrightstylestyle type=“text/css”style1 { bordercolor: blue green 1f1f1f blue。WIDTH－ 寬度?可以使用 長度值或百分數(shù)，也可以是auto(