在網頁設計中,背景漸變是常用的設計元素,可以讓網頁看起來更加美觀和有層次感。CSS3.0中提供了更加靈活和豐富的背景漸變方式。
/* 線性漸變 */ background: linear-gradient(direction, color-stop1, color-stop2, ...); /* 例子 */ background: linear-gradient(to bottom, #ffffff, #000000); /* 徑向漸變 */ background: radial-gradient(shape size at position, start-color, ..., last-color); /* 例子 */ background: radial-gradient(ellipse at center, #ffffff, #000000);
線性漸變指的是漸變的方向是直線的,可以從上到下、從左到右、對角線等等。可以指定多個顏色點,產生更加豐富的效果。
徑向漸變指的是將漸變色以一個中心點為基準,向四周進行漸變。也可以指定多個顏色點,產生更加豐富的效果。
以上是CSS3.0中常用的背景漸變方式,通過不同的方向和顏色組合,可以產生各種各樣的效果。