CSS線性漸變可以通過使用linear-gradient()函數來實現。你可以使用這個函數來創建一個線性漸變背景色或者漸變邊框。
以下是一個使用線性漸變背景色的例子:
div {
background: linear-gradient(to right, red, yellow);
}
這個例子將創建一個從紅色漸變到黃色的背景色。to right
指定了漸變的方向,可以使用其他關鍵字如to left
、to top
、to bottom
或者具體的角度值(例如45deg
)。
你也可以使用多個顏色來創建更復雜的漸變效果。例如:
div {
background: linear-gradient(to right, red, orange, yellow);
}
這個例子將創建一個從紅色到橙色再到黃色的漸變背景色。
你可以將這個漸變效果應用到任何具有背景色屬性的元素上,例如div、按鈕或鏈接等。
如果你想創建一個漸變邊框,可以使用border-image
屬性。例如:
div {
border: 5px solid;
border-image: linear-gradient(to right, red, yellow) 1;
}
這個例子將創建一個帶有從紅色到黃色的漸變邊框的div元素。1
表示漸變的邊框寬度。
希望這可以幫助到你!