有趣的CSS函式 linear gradient

2021-10-04 10:09:10 字數 833 閱讀 4429

最近在做乙個專案,專案中用到了純css的邊界動效,以及css絢麗的顏色處理,就抽時間把這幾個函式整理了一下。

css 有以下幾個函式:(標註css2的是指css2支援的 其他都是css3支援的)

attr() 返回選擇元素的屬性值(css2)。

calc() 允許計算 css 的屬性值,比如動態計算長度值。

cubic-bezier() 定義了乙個貝塞爾曲線(cubic bezier)。

hsl() 使用色相、飽和度、亮度來定義顏色。

hsla() 使用色相、飽和度、亮度、透明度來定義顏色。

linear-gradient() 建立乙個線性漸變的影象。

radial-gradient() 用徑向漸變建立影象。

repeating-linear-gradient() 用重複的線性漸變建立影象。

repeating-radial-gradient() 類似 radial-gradient(),用重複的徑向漸變建立影象。

rgb() 使用紅®、綠(g)、藍(b)三個顏色的疊加來生成各式各樣的顏色(css2)。

rgba() 使用紅®、綠(g)、藍(b)、透明度(a)的疊加來生成各式各樣的顏色。

var() 用於插入自定義的屬性值。

常用的有:calc() cubic-bezier() linear-gradient() radial-gradient() rgba()

具體的使用方法、屬性值及相容性,~

calc

cubic-bezier

linear-gradient

radial-gradient

rgb、rgba

有趣的 realloc 函式

在 c 語言中,我們最熟悉的函式排行榜上,malloc 和 free 想必名列前茅,而 realloc 則可能就要靠後了。不過你知道嗎,有了 realloc 函式,你甚至可以不使用 malloc 或者 free,而是由它一力承擔。該函式的原型如下 void realloc void ptr,size...

css中的有趣的 border

css 中的 border 屬性,我想凡是了解一點 css 的都知道它是作用,可以在 mdn 上找到對它的詳細介紹。簡單來說,就是我們常用的邊框,乙個非常基礎的用法,就是 border 1px solid black 等價於 border width 1px border style solid b...

有趣的CSS怪癖 邊框間距

我最近遇到了css的特殊性,這使我撓了撓頭,所以我認為值得在此處發表一些帖子,以供將來使用google搜尋的google抓撓頭。wsg郵件列表傳送了許多css布局問題,上週我注意到了這個查詢 tee希望直觀地重現下面顯示的 布局,而不新增額外的環繞式div或其他非語義標記。它並不像看起來那麼簡單。無...