- 徐々に変化
グラデーション(グラデーション)であるCSS3定義を参照され、導入された機能Module1のCSSレベル画像を。3。それは本質的に2次元画像缶背景 - 画像、リスト - スタイル - 画像との国境微着色のために。
- 勾配自体は、勾配ブロックの特定の大きさが、全く固有のサイズではありません
グラデーション効果を指定するには、単にあなたができ、これらの三つの要素を定義します。
- グラデーションライン(勾配ライン)
- (勾配線の出発点を開始)と終点(終点)
- 始点と終点の色値
このように、色が滑らかに傾斜されている行の残りの部分を埋めるだろう。
グラデーションタイプは、幾何学的に、ことができます。
- ライン(線):に対応したCSS グラデーション(線形リニアグラジエント)
- 放射線(X線)に対応するCSS ラジアル(半径方向の勾配)
- ヘリックス(螺旋):対応するCSS コーン勾配(円錐勾配)
構文を入力します。
<gradient> = <linear-gradient()> | <repeating-linear-gradient()> |
<radial-gradient()> | <repeating-radial-gradient()> |
<conic-gradient()> | <repeating-conic-gradient()>
- 勾配三つの要素:勾配ライン、開始点と終了点、色配列
構文は次のとおりです。
linear-gradient() = linear-gradient(
[ <angle> | to <side-or-corner> ]?,
<color-stop-list>
)
/*
参1:角度/渐变颜色走向
to top, to right, to bottom, to left,对应到<angle>分别是 0deg, 90deg, 180deg, 270deg
参2:渐变具体颜色 可接收多个颜色
*/
例えば: