CSS repeating-linear-gradient() 函數(shù)

CSS 函數(shù)

實(shí)例

重復(fù)的線性漸變:

#grad { background-image: repeating-linear-gradient(red, yellow 10%, green 20%); }

運(yùn)行代碼 ?

定義與用法

repeating-linear-gradient() 函數(shù)用于創(chuàng)建重復(fù)的線性漸變 "圖像"。

支持版本：CSS3

瀏覽器支持

表格中的數(shù)字表示支持該函數(shù)的第一個(gè)瀏覽器版本號。

"webkit" 或 "moz" 或 "o" 指定的數(shù)字為支持該函數(shù)的第一個(gè)版本號前綴。

函數(shù)
repeating-linear-gradient()	26.0 10.0?-webkit-	10.0	16.0 3.6?-moz-	6.1 5.1?-webkit-	12.1 11.1?-o-

CSS 語法

background: repeating-linear-gradient(angle | to side-or-corner, color-stop1, color-stop2, ...);

Value	描述
angle	定義漸變的角度方向。從 0deg 到 360deg，默認(rèn)為 180deg。
side-or-corner	指定線性漸變的起始位置。由兩個(gè)關(guān)鍵字組成：第一個(gè)為指定水平位置(left 或 right)，第二個(gè)為指定垂直位置（top 或bottom）。順序是隨意的，每個(gè)關(guān)鍵字都是可選的。
color-stop1, color-stop2,...	指定漸變的起止顏色，由顏色值、停止位置（可選，使用百分比指定）組成。

實(shí)例

不同的重復(fù)線性漸變:

#grad1 { background-image: repeating-linear-gradient(45deg, red, blue 7%, green 10%); } #grad2 { background-image: repeating-linear-gradient(190deg, red, blue 7%, green 10%); } #grad3 { background-image: repeating-linear-gradient(90deg, red, blue 7%, green 10%); }

運(yùn)行代碼 ?

CSS 教程: CSS3 漸變

CSS 函數(shù)

其他擴(kuò)展

上一篇：CSS radial-gradient() 函數(shù) 下一篇：CSS repeating-radial-gradient() 函數(shù)

中文字幕一区二区人妻电影,亚洲av无码一区二区乱子伦as ,亚洲精品无码永久在线观看,亚洲成aⅴ人片久青草影院按摩,亚洲黑人巨大videos

CSS repeating-linear-gradient() 函數(shù)

實(shí)例

定義與用法

瀏覽器支持

CSS 語法

更多實(shí)例

實(shí)例