css基礎選擇器教程,偽類選擇器hover的使用?
定義和用法:hover 選擇器用于選擇鼠標指針浮動在上面的元素。提示::hover 選擇器可用于所有元素,不只是鏈接。提示::link 選擇器設置指向未被訪問頁面的鏈接的樣式,:visited 選擇器用于設置指向已被訪問的頁面的鏈接,:active 選擇器用于活動鏈接。注釋:在 CSS 定義中,:hover 必須位于 :link 和 :visited 之后(如果存在的話),這樣樣式才能生效。代碼效果測試:
請把鼠標指針移動到這些鏈接上。
這個鏈接改變顏色。
這個鏈接改變字體大小。
這個鏈接改變背景色。
這個鏈接改變字體。
這個鏈接會出現下劃線。
css的基本語法和標簽?
CSS規則由兩部分組成,選擇器,和一條或多條聲明,例如:
h1 {color:blue; font-size:12px;}
選擇器通常是html中的一個標簽,每條聲明由一個屬性和屬性值組成,一般是樣式屬性
CSS一般寫在html文件中的<style></style>標簽里面,
CSS注釋:以/* 開頭,*/結尾
css3新增功能?
1、css3新增的超級選擇器:屬性選擇器、結構性偽類選擇器、UI元素狀態偽類選擇器、通用兄弟元素選擇器
2、使用選擇器在頁面中插入文字、圖片、項目編號等內容
3、文字陰影與自動換行
4、各類盒模型:總體分為block類型和in line類型,在細分為inline-block類型、inline-table類型、list-item類型、run-in類型、compact類型、表格相關類型、none類型
5、盒模型相關的屬性:overflow屬性(內容溢出)、box-shadow屬性(盒陰影)、box-sizing屬性(寬高計算)
6、新增的背景樣式backround-clip屬性、backround-origin屬性、backround-size屬性、backround-break屬性
7、新增的邊框樣式:border-radius屬性(圓角邊框)、border-image屬性(圖片邊框)
8、新增的 transform變形功能:rotate(旋轉)、scale(縮放)、skew(傾斜)、translate(移動)
9、新增的動畫功能:transition(平滑過渡)、animation(關鍵幀)
10、布局相關樣式:多欄布局、盒布局、彈性盒布局
11、兼容性問題
css超鏈接link怎么用?
1. 打開文檔,然后打開“CSS樣式”面板。
2. 在“CSS樣式”面板中,點擊右下角的“新建 CSS 規則”按鈕,打開“新建 CSS 規則”對話框。
在“選擇器類型”中選擇“復合內容(基于選擇的內容)”項。
在“選擇器名稱”中點擊右邊的下拉箭頭,我們可以看到:
a:link:未訪問的超鏈接。
a:visited:已經訪問過的超鏈接。
a:hover:鼠標指針移動到上面時的超鏈接。
a:active:正在訪問的超鏈接。
3. 在“選擇器名稱”中選擇“a:link”項,然后點擊“確定”按鈕,打開“CSS 規則定義”對話框。
4. 在“CSS 規則定義”對話框中,在“分類”下拉框中選擇“類型”,然后在右邊“類型”部分設置鏈接字體的顏色、大小和修飾等。
5. 設置好以后單擊“確定”按鈕,完成“a:link”項的設置。