CSS核心原理

2022-06-21 23:57:11 字數 727 閱讀 5639

1.優先原則:

後解析的內容,會覆蓋掉之前解析的內容;

同乙個選擇器:檔案執行從上往下,後面的樣式會覆蓋前面的;

如下例中color最終為粉色;

div

同一型別的選擇器:從上往下,如下例中color最終為綠色;

div 

div

背景顏色最終為綠色,(解析順序與css檔案中的排列有關,從上到下)

.txt1 

.txt2

不同型別的選擇器:先解析低優先順序的選擇器,後解析高優先順序的選擇器;(*《標籤因此有衝突時,最終生效的會的高優先順序的選擇器定義的樣式;

外部樣式 與 內部樣式 :合併之後一起解析 先外部樣式 後內部樣式 再從上往下執行

因此有衝突時,最終應用的是內部樣式

內聯樣式 : 只有外部樣式與內部樣式解析完成後,才解析內聯樣式

因此有衝突時,最終應用的是內聯樣式。

加了 !important 字段:最後解析

因此有衝突時,最終應用的是加了 !important 欄位的樣式。 

2.繼承原則:

巢狀裡面的標籤會擁有外部標籤的某些樣式,即子元素會繼承父元素的某些樣式

1)與文字 文字 樣式有關的,可以被繼承,其他不能被繼承;

2)對於塊級元素,如果寬度未設定,會繼承最近父元素的寬度,高度未設定,由內容決定;

angularJS核心原理

一 angularjs優點和缺點 優點 1.1免去重複勞動 獲取元素 給元素加事件 建立元素 1.2接管ui angularjs根據資料建立ui元素,免去手工建立ui元素。1.3自動同步 根據資料個數建立對應的html元素。缺點 二 angularjs一切皆資料 三 angularjs三要素 4.1...

redis核心原理

1 redis的單執行緒和高效能 redis 單執行緒為什麼快?因為它所有的資料都在記憶體中,所有的運算都是記憶體級別的運算 納秒 而且單執行緒避免了多執行緒的切換 上下文切換 效能損耗問題。正因為 redis 是單執行緒,所以要小心使用 redis 指令,對於那些耗時的指令 比如keys 一定要謹...

Preact(React)核心原理

在前端界,react 一定是我們耳熟能詳的前端開發框架之一,它的出現可以說是帶給了我們全的 web 開發體驗,其中也帶來了許多新的概念 jsx virtual dom 元件化 合成事件等。當我們想從原始碼層面去研究它的原理時,由於 react 的原始碼的龐大和晦澀難懂,這也會變得異常困難。但是在愛好...