CSS 關於css中的border

2021-06-21 05:54:18 字數 813 閱讀 1793

曾經一直以為html中的border是直角的,直到有一天:

.test
效果如下:

突然有一種被欺騙了的感覺。

我們可以選擇理解乙個border為兩個三角形再加乙個矩形。如上所示。

繪製小尾巴:

當對乙個角應用圓角樣式,如果這個角相鄰的兩個border乙個有定義而乙個無定義,那麼繪製的結果就是由粗到細的「小尾巴了」。[在整個繪製過程中,同乙個圖形它的繪製方法有很多種,例如乙個矩形可以用 width x height構成,也可以由border x height(width)構成,甚至可以由border組合(width = height = 0)構成,根據情況選擇吧。]

偶有所得,以記錄之,以防忘記。

關於css中的position

對於position的幾個屬性 static 無特殊定位,物件遵循html定位規則 absolute 將物件從文件流中拖出,使用left,right,top,bottom等屬性進行絕對定位。而其層疊通過z index屬性定義。此時物件不具有邊距,但仍有補白和邊框 relative 物件不可層疊,但將...

關於css中overflow hidden的使用

overflow hidden有兩個用處經常用到 1 通過設定自身的高度,加上overflow hidden可以隱藏超過容器本身的內容 但是,小編在以往的使用中,發現了乙個問題,只要父級容器設定了overflow hidden,那麼它的子孫元素都將會應用上去,並無法在內部消除,如果內部需要做div絕...

CSS關於網頁中的文字

字型的處理在網頁設計中無論怎麼強調也不為過,畢竟網頁使用來傳遞資訊的,而最經典最直接的資訊傳遞方式就是文字,所以,了解一點字型的基本知識對於設計來說還是非常重要的。下面總結一些平時經常能用到的 文字行間距 line height 行間距取決於字型的大小,一般來說,小的字型大小需要大一點的行間距來便於...