css不顯示問題

2021-08-22 14:10:50 字數 1374 閱讀 5713

如果頁面製作的時候遇到定義的css不起作用,你可能遇到了css優先順序的問題。css優先順序在css裡算是比較難懂的部分,不同權重的css選擇器有可能就是你出錯的原因,所以作為頁面開發人員必須了解css優先順序特性。

css優先順序特性概述:

1. 通過優先順序計算,讓瀏覽器先解析哪條css規則。

2. 優先順序特性經常是你定義的css規則不起作用的原因,雖然你認為起了作用,然而卻不是。

3. 每個選擇器都有它的優先順序層次。

4. 如果兩個規則同時作用於乙個元素,優先順序高的獲勝。

5.優先順序特性可以分為四類:inline styles, ids, classes+attributes and elements.

6.英文好的可以看下這兩篇文章, css specificity wars和css specificity for poker players

7.如果選擇器有兩個等級相同的值,後面的值會覆蓋前面的值。

8.如果選擇器有等級不同的值,以等級高的算,比如!important。

9.擁有更多優先特性選擇器的規則更具有優先特性。

10.後面的規則肯定會覆蓋前面相同的規則。

11.內嵌的css規則優先順序特性最高。

12.css檔案裡,id的優先順序特性最高。

13.想要增加優先順序,可以使用id。

14.class比element級別高。

15.選擇器分為四個級別,計算方式 0,0,0,0。

16.推薦乙個css優先順序計算器,css specificity calculator.。

什麼是優先順序特性

優先順序計算是為了決定瀏覽器解析哪條規則。「優先順序特性的權重關係css的顯示。」understanding specificity (明白優先順序特性)。

選擇器的優先順序特性決定了同乙個元素多條規則下哪條規則實施。selector specificity (選擇器優先順序)。

每個選擇器都有優先順序,兩個選擇器作用與同乙個元素,優先順序高的獲勝。

css優先順序級別:

1. inline styles 內嵌頁面的css樣式,比如

2.ids 比如#myid

3.classes, attributes and pseudo-classes 比如 .classes, [attributes]:hover, :focus

4.elements and pseudo-elements 比如 div,p,h1,包括:before和:after

怎樣測量優先順序?

內嵌的為1000,id為100,classes, attributes and pseudo-classes為10,elements and pseudo-elements 為1。

body #content .data img:hover 這裡的特性值為 0,1,2,2

xib button不顯示問題

前面執行程式發現button顯示不了但是xib上明明顯示了 糾結半天發現button的image沒有設定,但是xib上缺顯示有,坑 autolayout中constraints 約束上 align center x to superview 代表定位在上級檢視中間 錯誤提示是 uicollectio...

IReport PDF 中文不顯示問題

方法一 1 首先,在用ireport設計報表時將要顯示中文資料的地方的屬性設定如下 font name 宋體 中文字型 pdf font name stsong light pdf encoding unigb ucs2 h chinese siplified pdf embeded 2 itext...

INTELLIJ IDEA 介面不顯示問題

電腦主機外接了兩個顯示器 今天開啟intellij idea後將其從乙個顯示屏拖動到另乙個顯示屏後整個intellij idea介面消失了,分析原因發現可能是因為拖動介面時沒有拖到位導致的。在主機只連線乙個顯示屏的條件下,進入intellij idea開啟專案所在資料夾根目錄,進入.idea資料夾後...