前端開發知識點之 css

2021-09-16 12:19:28 字數 805 閱讀 6223

css兩個性質:

1)繼承性。有一些屬性給祖先元素,所有的後代元素都整合上了。

2)層疊性。層疊性是一種能力,就是處理衝突的能力。當不同選擇器,對乙個標籤的同乙個樣式,有不同的值,聽誰的?這就是衝突。css有著嚴格的處理衝突的機制:

以下是權重的規則:標籤的權重為1,class的權重為10,id的權重為100,以下例子是演示各種定義的權重值:

/*權重為1*/

div/*權重為10*/

.class1

/*權重為100*/

#id1

/*權重為100+1=101*/

#id1 div

/*權重為10+1=11*/

.class1 div

/*權重為10+10+1=21*/

.class1 .class2 div

如果權重相同,則最後定義的樣式會起作用,但是應該避免這種情況出現! important不允許使用。因為會讓css寫的很亂。

我是什麼顏色?

我是什麼顏色?

answer :都是紅色的,因為css中red寫在後面。

三欄自適應

雙飛翼布局 flying swing layout

二欄自適應

前端知識點(css)

快速使 變灰色 html form表單的時候,前面經常有姓名,年齡,公司名稱等等,有的是2個字,有的是4個字,如何讓字對齊 test1 mediascreen and webkit min device pixel ratio 0 將此樣式應用於文字所在標籤 常見的中英文對照 黑體 simhei宋體...

前端開發知識點總結

很多時候我們會有下面的場景,如下圖中所顯示的那樣。點選1區域 從圖上看1區域包含2區域 和2區域跳轉不同的鏈結。正常的 結構應該是 但是上面的 瀏覽器的編譯結果是下面這樣 很明顯可以發現,瀏覽器的渲染結果並不是我們想要的結果。那麼是為什麼呢?根據 w3c 規範,a 標籤是不是巢狀 a 標籤的。如果出...

前端面試知識點 CSS

css 1,垂直居中的方法這是我看過的比較好的方法 盒子 box 內容.flex1 3,display inline block中間出現空白的問題 底部在上面的正三角形 box 5 margin和padding的關係,百分比相對於誰 在margin是外邊距,padding是內邊距,有五個不同值,ma...