使用谷歌瀏覽器進行除錯,在屬性不理解時可以直接在瀏覽器裡進行數值調節
css在書寫時由於選擇器權重問題經常出現樣式覆蓋的問題
如果你的選擇器書寫正確,並且被劃掉了。
那應該就是權重不足導致的
下面是看起來很複雜的權重規則。
權重規則:html標籤(型別選擇符)的權重是1,class的權重是10,id的權重是100。
權重的表達方式如: 0,0,0,0;
型別選擇符的權重為: 0,0,0,1
class選擇符的權重為: 0,0,1,0
id選擇符的權重為: 0,1,0,0
屬性選擇符的權重為: 0,0,1,0
偽類選擇符的權重為: 0,0,1,0
偽元素選擇符權重為: 0,0,0,1
內聯樣式的權重為: 1,0,0,0
注:如果權重相同時,則後面的樣式生效;
權重值的計算規則略複雜,不再詳細說明了
你就簡單把這些權重值當成10進製進行求和,能解決大多數問題
結果出現的問題的時候,就公升級為100進製,舉例說明
#a1 .a2 .a3 .a4 .a5
#a1 #a2 .a5
以上兩個選擇器誰權重更大呢?
100 + 10 + 10 + 10 + 10
100 + 100 + 10
答案,很明顯是第二個。
另外還有一些新手常見的,
搞不清楚可能會困擾你很久,但搞清楚了這都算個p的那種css問題
1、比如浮動所引發的問題
父元素未設定高度時,子元素浮動會導致父元素高度塌陷。
怎麼解決?
給父元素固定高度,或者 父元素新增 overflow:hidden;
2、關於定位的問題
元素使用了絕對定位position:absolute
導致元素(由於找不到參考係)會根據整個頁面來定位
3、邊框和padding問題
給元素增加邊框和填充,都會影響盒子的大小
務必不能忽略這一點。
初學時,建議使用以下**,進行css重置
*
4、margin的問題
margin:auto 只能實現元素左右居中,實現不了上下居中
5、要分清楚塊元素和行內元素的區別
塊元素預設都是100%寬度的,會獨佔一行
可以設定寬高大小
而行內元素,像 、這種
設定不了寬高,從左到右排列
6、img標籤是特殊的存在
表現出來的特性和文字差不太多
可將理解為特殊的文字內容
7、選擇器的含義
.page .con 和 .page.con 和 .page>.con三者的含義不同
.page>.con 大於號表示必須是子元素
.page.con 中間沒有空格表示同時擁有兩個類
.page .con中間有空格,表示所有後代包含子元素
以上這些
足夠你在最短的時間,解決95%以上css的新手坑了
C 難學嗎?為什麼難學?如何去學?
c 難學嗎?為什麼難學?如何去學?經常上網,發現最多人問的問題就是c 難不難學。而得到的回答卻基本上是說很難學,甚至有說要兩年才算入門。我開始是學vb的,現在轉學qt。談談我對c 的看法。1 入門興趣和方向 2 教材及細節 網上找一下vb的教材,都是一些基本的語法,從來不介紹更為底層的實現和細節。更...
為什麼c 的指標那麼難學?
指標本身是乙個很淺顯的概念,它就是代表了記憶體中的乙個位址 通過這個位址 就能獲取這個位址上儲存的資料 嗯,很簡單的道理。但為何寫起 來就感覺被漿糊團團圍住?因為語言發明者給剛入門的程式設計師搞了乙個非常不友好的設定 兩個意思相近但其實很不一樣的操作符 卻用了同乙個符號!在宣告乙個變數名字是什麼型別...
我為什麼這麼累?
我為什麼這麼累?工作後,我常感到疲憊不堪,為此我的解釋是睡眠不足。可最近,看了一組資料之後才知道,我不是缺乏睡眠,而是工作過度 中國一共有12億人口,其中有三億退休,那就只剩下9億人工作了 8億人在農村,那就只剩下一億人在工作 二千萬是學生,那只剩下八千萬人在工作 這八千萬當中有四千萬是 工作人員,...