2017/3/2 CSS學習部分總結
CSS選擇器樣式:
選擇器{
樣式程式碼... ...;
}
選擇器{
樣式程式碼... ...;
}
常用選擇器:
-
標籤選擇器
格式:標籤{ ... ... } -
類選擇器
. 類名{ ... ...} //可以用多個類選擇器 -
ID選擇器
例如:
下面程式碼是正確的:
三年級時,我還是一個膽小如鼠的小女孩,上課從來不敢回答老師提出的問題,生怕回答錯了老師會批評我。就一直沒有這個勇氣來回答老師提出的問題。
而下面程式碼是錯誤的:三年級時,我還是一個膽小如鼠的小女孩,上課從來不敢回答老師提出的問題,生怕回答錯了老師會批評我。就一直沒有這個勇氣來回答老師提出的問題。
-
子選擇器
標籤元素1>標籤元素2{ ... ...} //標籤1的後一個 - 後代選擇器(包含選擇器)
標籤元素1 標籤元素2{ ... ...} //所有標籤2的內容
總結:>作用於元素的第一代後代,空格作用於元素的所有後代
6.偽類選擇器
a:hover{ ... ... } //要考慮瀏覽器的相容性問題
7.分組選擇器
標籤1,標籤2,...{ ... ...} //同時為幾個標籤設定相同的樣式
8.通用選擇器
*{ ... ...}
------------------------------------俺滴小分割^_^ ---------------------------------------
-
對於瀏覽器來說,對CSS樣式的載入時採用就近原則的,及內聯式>嵌入式>外部式
-
在CSS樣式中,先解析哪種樣式,是透過各選擇器的權值,一般,類選擇器的權值為10, 標籤選擇器為1,ID選擇器最高為100,繼承(CSS中有些樣式可以繼承)最低,0.1。
p{color:red;} /*權值為1*/ p span{color:green;} /*權值為1+1=2*/ .warning{color:white;} /*權值為10*/ p span.warning{color:purple;} /*權值為1+1+10=12*/ #footer .note p{color:yellow;} /*權值為100+10+1=111*/
- 對於一些樣式,要想它最先被解析,可設定為!important
例如:
p{ color : red !important; }
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/1834/viewspace-2798404/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- shell學習總結-2
- shell學習總結-3
- CSS技巧總結2CSS
- 2017前端實習生面試總結前端面試
- 【博學谷學習記錄】超強總結,用心分享|前端CSS總結(一)前端CSS
- 【CSS】CSS 世界 — 元素的顯示與隱藏學習總結CSS
- 關於Html+css階段學習總結HTMLCSS
- css3新特性總結CSSS3
- MySQL深入研究--學習總結(2)MySql
- MySQL深入研究--學習總結(3)MySql
- bootstrap學習心得總結:css樣式設計分享bootCSS
- 學習python有關統計基礎部分課程總結Python
- CSS3一些總結CSSS3
- 初學者css每日總結CSS
- 學習總結
- 【讀書1】【2017】MATLAB與深度學習——深度學習(2)Matlab深度學習
- LC-3 虛擬機器學習總結虛擬機機器學習
- 第三週:java物件導向部分總結(2)Java物件
- ConstraintLayout 學習總結AI
- BOM學習總結
- tkinter學習總結
- vue學習總結Vue
- HSF學習總結
- ElasticSearch 學習總結Elasticsearch
- Storm學習總結ORM
- vue 學習總結Vue
- lua 學習總結
- Angularjs 學習總結AngularJS
- WebRTC學習總結Web
- GCD 學習總結GC
- CompletableFuture學習總結
- awk 學習總結
- MyBatis 學習總結MyBatis
- Maven學習總結Maven
- Ajax學習總結
- JVM學習總結JVM
- mysqlimport學習總結MySqlImport
- WorkFlow學習總結