案例胡老師-php基礎(chǔ)css

1、CSS3-2主講:郵箱:微博:上一章內(nèi)容復(fù)習(xí)CSS作用是什么，基本語(yǔ)法結(jié)構(gòu)？CSS嵌入HTML中的方式有哪些？基本選擇器有哪些？層級(jí)選擇器有哪些？預(yù)習(xí)檢查color顏色 CSS相關(guān)屬性Font字體 CSS相關(guān)屬性text文本 CSS相關(guān)屬性List列表 CSS相關(guān)屬性border邊框 CSS相關(guān)屬性本章內(nèi)容CSS3屬性color顏色Font字體 text文本 List列表content內(nèi)容border邊框color顏色HSL顏色：HSL色彩模式是工業(yè)界的一種顏色標(biāo)準(zhǔn)，是通過(guò)對(duì)色調(diào)(H)、飽和度(S)、亮度(L)三個(gè)顏色通道的變化以及它們相互之間的疊加來(lái)得到各式各樣的顏色的，HSL即是代表色調(diào)，

2、飽和度，亮度三個(gè)通道的顏色，這個(gè)標(biāo)準(zhǔn)幾乎包括了人類視力所能感知的所有顏色，是目前運(yùn)用最廣的顏色系統(tǒng)之一。background-color: hsl(240,100%,50%);color:white；HSLA顏色：HSL色彩模式是工業(yè)界的一種顏色標(biāo)準(zhǔn)，是通過(guò)對(duì)色調(diào)(H)、飽和度(S)、亮度(L)三個(gè)顏色通道的變化以及它們相互之間的疊加來(lái)得到各式各樣的顏色的，HSL即是代表色調(diào)，飽和度，亮度三個(gè)通道的顏色，這個(gè)標(biāo)準(zhǔn)幾乎包括了人類視力所能感知的所有顏色，是目前運(yùn)用最廣的顏色系統(tǒng)之一。HSLA是在HSL的基礎(chǔ)上增加一個(gè)透明度(A)的設(shè)置。background-color: hsla(0,100%,5

3、0%,0.2);color顏色RGB顏色：RGB色彩模式（也翻譯為“紅綠藍(lán)”，比較少用）是工業(yè)界的一種顏色標(biāo)準(zhǔn)，是通過(guò)對(duì)紅(R)、綠(G)、藍(lán)(B)三個(gè)顏色通道的變化以及它們相互之間的疊加來(lái)得到各式各樣的顏色的，RGB即是代表紅、綠、藍(lán)三個(gè)通道的顏色，這個(gè)標(biāo)準(zhǔn)幾乎包括了人類視力所能感知的所有顏色，是目前運(yùn)用最廣的顏色系統(tǒng)之一。RGBA：在RGB基礎(chǔ)上多了控制alpha透明度的參數(shù)。以上R、G、B三個(gè)參數(shù)，正整數(shù)值的取值范圍為：0 - 255。百分?jǐn)?shù)值的取值范圍為：0.0% - 100.0%。超出范圍的數(shù)值將被截至其最接近的取值極限。并非所有瀏覽器都支持使用百分?jǐn)?shù)值。A參數(shù)，取值在01之間，不可

4、為負(fù)值。background-color: rgba(0,0,0,0.5);透明度 ： img.opacity opacity:0.25;font字體屬性說(shuō)明font 復(fù)合屬性。設(shè)置或檢索對(duì)象中的文本特性font-style字體樣式normal | italic | obliquefont-variant小型的大寫字母normal | small-capsfont-weight設(shè)置或檢索對(duì)象中的文本字體的粗細(xì)normal | bold | bolder | lighter | font-size設(shè)置字體尺寸： | | | font-family設(shè)置字體名稱family-namefont-str

5、etch設(shè)置文字是否橫向拉伸變形【了解】見手冊(cè)Text文本屬性說(shuō)明值text-indent文本的縮進(jìn)text-overflow文本的溢出text-align文本的對(duì)齊方式text-transform文本的大小寫text-decoration文本的裝飾text-decoration-line裝飾線條的位置【了解】Text文本屬性說(shuō)明值text-decoration-color文本裝飾線條的顏色text-decoration-style文本裝飾線條的形狀text-shadow文字是否有陰影及模糊效果text-fill-color文字填充顏色【了解】text-stroke文字的描邊【了解】text-

6、stroke-width文字的描邊厚度 【了解】text-stroke-color文字的描邊顏色 【了解】Text文本屬性說(shuō)明值letter-spacing文字之間的間隔word-spacing單詞之間間隔vertical-align垂直對(duì)其方式word-wrap溢出邊界處理，是否換行white-space空格的處理方式direction文本流的方向unicode-bidi一個(gè)頁(yè)面里存在從不同方向讀進(jìn)的文本顯示了解line-height底端與字體內(nèi)部頂端之間的距離tab-size制表符的長(zhǎng)度【了解】列表List屬性說(shuō)明list-style 復(fù)合屬性。設(shè)置列表項(xiàng)目相關(guān)內(nèi)容list-style-image設(shè)置或檢索作為對(duì)象的列表項(xiàng)標(biāo)記的圖像list-style-position設(shè)置或檢索作為對(duì)象的列表項(xiàng)標(biāo)記如何根據(jù)文本排列l(wèi)ist-style-type設(shè)置或檢索對(duì)象的列表項(xiàng)所使用的預(yù)設(shè)標(biāo)記border邊框新特性屬性說(shuō)明border設(shè)置對(duì)象邊框的特性 border-width設(shè)置或檢索對(duì)象邊框?qū)挾?border-styl