級聯(lián)樣式表(Cascading Style Sheet,CSS)旨在將web頁面的樣式與內(nèi)容進(jìn)行分離。
選擇器就是不帶尖括號的HTML標(biāo)記。CSS屬性用來定義選擇器的特定特性。
- 當(dāng)為屬性指定屬性值時,就是為選擇器創(chuàng)建一個聲明。(在一個CSS屬性名之后使用一個冒號,后跟該屬性的值,屬性值無須使用引號括起【對于用長度或百分比作為單位的值,通過在值之前添加一個正號或負(fù)號,可以使之取值為正或負(fù)】,屬性值之后是一個分號)可將聲明和選擇器合稱為一個規(guī)則集合,在典型規(guī)則集中,將聲明放在一對花括號中,位于選擇器之后。
(百分比允許元素根據(jù)屏幕的大小和窗口的尺寸進(jìn)行調(diào)整和移動,用于指出它與包含它的父元素之間的關(guān)系)
**
**
創(chuàng)建樣式的優(yōu)先級:內(nèi)聯(lián)(直接嵌入到它所影響的HTML代碼中)>內(nèi)部(放在web頁面的<head>信息中)>外部(外部樣式的代碼放在一個獨立的文檔中,從實際使用該樣式表的web頁面的<head>標(biāo)記中引用該樣式,使用單個外部樣式表可定義多個web頁面的呈現(xiàn)效果)
【當(dāng)在一個標(biāo)記中添加內(nèi)聯(lián)樣式表時,它僅影響單個標(biāo)記,不影響到頁面中所有類似的元素,若想改變一個頁面中所有類似元素的樣式,用<style>元素自身來包含該頁面所有的樣式指令。在外部樣式表中無須使用<style>元素或style特性,在創(chuàng)建外部樣式表后,使用.css作為文件擴(kuò)展名,將其另存為一個文本文件?!?/p>
- 【為了聲明一個樣式更加重要,只需在樣式聲明之后添加important關(guān)鍵字,為了讓瀏覽器能正確的分析,必須將important關(guān)鍵字放在一個嘆號之后?!?/li>
**
**
Web開發(fā)中引用顏色的方法:
- 計算機(jī)的顯示器以RGB模式來顯示顏色**,R代表紅色,G代表綠色,B代表藍(lán)色。R,G,B用一個介于0~255之間的值來表示,在色譜中,0代表最暗,255代表最亮。
- 在HTML頁面中使用十六進(jìn)制顏色值時,需要將顏色值從十進(jìn)制(RGB)轉(zhuǎn)化為十六進(jìn)制。將紅,綠,藍(lán)色值分別轉(zhuǎn)化為一個兩位的十六進(jìn)制值。然后將這三個十六進(jìn)制值合并在一起作為單個字符串,并在開頭加上一個井號(#)。當(dāng)引用的顏色具有成對的值時,可以使用簡寫方式以減少所需輸入字符的數(shù)量。/Eg:十六進(jìn)制值003366的一個顏色值簡寫為036./
-
RGB值和百分比:顏色值容易得到用RGB值,eg:<p style=”color:
rgb(0,0,,255);”>
沒有方便的RGB值,可使用RGB值的百分比。<p style=”color: rgb(0%,0%,100%);”>
在每一個R,G,B值之間請使用一個逗號進(jìn)行分隔,將整組值放在一對圓括號之中。在圓括號之前是小寫的rgb三個字符,RGB值和百分比只能在樣式表中描述顏色。
- HTML5/CSS3中更新,對顏色透明度的支持。采用RGBA方法可以指定顏色的alpha值。Eg:
h1 {color: rgba(255,68,253,0.5);}
- opacity的取值范圍為0.0(完全透明)~1.0(完全不透明)
eg:div.transparentbox
{background-color:#036; opacity:0.7;}
[color屬性用于指定文本的前景色,background-color屬性用于確定背景色]
body {background-image: url(images/background.jpg);}//是通過URL引用背景圖片images/background.jpg
當(dāng)想改變頁面鏈接的顏色時,應(yīng)該使用a元素作為CSS選擇器。(a標(biāo)記和href特性用于鏈接到其他網(wǎng)址。)
當(dāng)想改變頁面背景顏色時,應(yīng)該使用body元素作為CSS選擇器。