CSS入門經典 知識點摘錄

2022-07-27 21:00:23 字數 2703 閱讀 9444

width屬性的「收縮」和「擴充套件」適應

所有帶width屬性的元素都有乙個預設的auto值,但在使用auto寬度時並不是所有元素都具有相同的效果。例如,元素只是水平擴充套件以容納其中的資料,這種方法稱為「收縮適應」。另一方面,元素則盡可能水平擴充套件其寬度,這種方法稱為「擴充套件適應」。

計算選擇器的針對性

作為對樣式表優先順序的乙個補充,每個樣式表中的選擇器也存在優先順序順序。這種優先順序由選擇器的針對性決定。比如,id選擇器最有針對性,通用選擇器最為一般化。在他們之間,選擇器的針對性使用以下公式計算:

1、  設乙個變數a,若樣式是通過(x)html的style屬性應用的,a的值為1,否則為0.

2、  計算選擇器中id屬性的數量,和為變數b的值。

3、  計算選擇器中屬性、偽類和類名的數量,三者之和為變數c的值。

4、  計算選擇器中元素名的數量,和為變數d的值。

5、  忽略偽元素

.把每個變數中的數字連線在一起得到選擇器的針對性。連線是乙個程式設計術語,表示粘合。在這裡,將a、b、c、d連線得到abcd,而不是計算a、b、c、d之和得到另乙個變數e。

選擇器選擇器型別

針對性*

通用選擇器

0000

(a=0,b=0,c=0,d=0)

li元素名

0001

(a=0,b=0,c=0,d=1)

ul li

元素名0002

(a=0,b=0,c=0,d=2)

div h1+p

元素名0003

(a=0,b=0,c=0,d=3)

input[type=』text』]

元素名+屬性

0011

(a=0,b=0,c=1,d=1)

.someclass

類名0010

(a=0,b=0,c=1,d=0)

div.someclass

元素名+類名

0011

(a=0,b=0,c=1,d=1)

div.someclass.someother

元素名+類名+類名

0021

(a=0,b=0,c=2,d=1)

#someid

id名0100

(a=0,b=1,c=0,d=0)

div#someid

元素名+id名

0101

(a=0,b=1,c=0,d=1)

style(屬性)

style(屬性)

1000

(a=1,b=0,c=0,d=0)

在針對性圖表中包括了前置0來表示連線是如何工作的,但實際上要省去。要決定優先順序的次序,只需要簡單地確定最大的數字。當兩個或多個選擇器有相同的優先順序,最後乙個將優先適用。style屬性比所有其他規則都優先。

!important規則

隨著css中的層疊機制而來的是重寫它的需求。這就是!important規則的**。!important語法出現在宣告中,在屬性值之後,結束宣告的分號之前。該語法由兩個部分組成:乙個感嘆號作為分隔符,然後是important

關鍵字。分隔符標誌著乙個組成部分的結束,另乙個組成部分的開始。在這裡感嘆號標誌著宣告的結束。important關鍵字必須緊跟著出現,然後是結束整個宣告的分號。如:p

該規則優先於style屬性。

用margin屬性來水平對齊元素

用atuo關鍵字和margin屬性一起協作可以左對齊、居中對齊或者右對齊乙個元素。

左對齊時margin-left設為0,margin-right設為auto,右對齊反之,居中對齊則左右都是auto。

但ie(有別於標準)可以使用text-align屬性來對齊元素。這個技術在其他瀏覽器中不起作用。

寬度和高度的auto值

在預設情況下,width和height屬性的值為auto,所以當不指定寬度和高度時,他們的值都就是auto關鍵字。auto關鍵字會根據應用的元素型別發生改變。當它應用在元素上時,意味著元素將橫跨所有可用控制項;垂直方向上,會擴充套件到容納元素內部所有的內容,包括文字、影象或者其他盒子。具有這種行為的元素叫做塊級元素有、、~、和元素等。

浮動盒模型

浮動的元素會被重新定位,以便允許其他的內容在它們周圍浮動,這種行為很獨特。關於這種行為的描述如下:

1、  浮動元素的外邊距不會摺疊,不管它們如何靠近

2、  只有浮動元素後面的元素內容會被該浮動元素所影響。就是說浮動元素後面元素的背景、外邊框、邊框、內邊距和寬度(盒模型和尺寸)都不受影響。

3、  浮動元素總是會被當作塊級元素來對待

當乙個元素浮動時,它表現得像乙個塊級元素,但有乙個主要區別:它的大小設定變成水平方向和垂直方向都是收縮適應。這意味著在浮動乙個元素時,它的尺寸只會擴充套件到足夠容納裡面的內容。

回顧相對定位:

1、  相對定位類似於靜態定位,其元素保持在正財的文件流中,但這也是僅有的相似之處。

2、  相對定位元素可以用作絕對定位元素的參考點。

3、  相對定位元素可以接受4種偏移屬性的組合方式有:top和left、top和right、bottom和left、bottom和right,瀏覽器將忽略除此之外的其他種組合方式。例如,不能對乙個相對定位的元素同時使用top和bottom偏移屬性。

4、  相對定位的內容可以堆疊和分層放置在z軸上

模板匹配知識點摘錄

定義 首先,需要製作模板,將模板以一定角度旋轉,製作 0 360 的各個方向的模板,模板影象 t 從目標影象的原點處每次移動乙個畫素,直到匹配分數達到最低要求找到目標物體。在定義相似度量之前,先作如下定義 目標物體的模板定義為點集 以及這些點對應的方向向量 n 為模板上的畫素點數。方向向量的獲取可以...

C 結構知識點摘錄

結構定義的一般形式為 struct 結構名 例如,分數包含兩個成員 分子和分母,可以定義為乙個結構。分數結構名可以取名為 rationalnumber 兩個成員都是整型變數,可以分別取名為 fenzi 和 fenmu,則分數結構可以定義為 struct rationalnumber 結構的定義是定義...

Mysql 經典知識點

表鎖 table lock 對整張表加讀寫鎖,讀鎖可以之間不會相互阻塞,但是當有寫鎖時,任何使用者都不可以獲取讀鎖 並且寫鎖比讀鎖的優先順序高,乙個寫的命令可能被插入讀命令之前.行級鎖 row lock 行級鎖對每一行新增讀寫鎖,這樣可以實現最大程度地支援併發處理,但是也有最大的鎖開銷.乙個事務時最...