CSS box-shadowプロパティの役割は何か

CSSのbox-shadowプロパティは、要素に影の効果を追加するために使用されます。要素の境界線外側に1つ以上の影を作成できます。box-shadowプロパティの値を調整することで、平板な影、内側の影、ぼやけた影、投影などのさまざまな種類の影効果を実現できます。

box-shadowプロパティの構文は次のとおりです。

ボックスシャドウ: 横影 縦影 ぼかし 広がり 色 インセット

その中の

  1. 横影の発生する水平方向の位置。正の数(右)または負の数(左)が指定可能。
  2. v-shadow: 垂直方向の影の位置。正の数(下方向)または負の数(上方向)を指定できます。
  3. ぼかし:影ぼかしの半径を指定します。初期値は0で、ぼかしは適用されません。
  4. スプレッド:オプション、影のサイズ。 デフォルトは0で、影が要素のサイズと同じことを意味します。
  5. 色:オプション。陰影の色。色名、16進数値、RGB値を使用できます。
  6. Inset: オプション。影が内側にあるかどうかを指定します。既定値はfalseで、これは外側の影です。

ボックスシャドウのプロパティを用いることで、要素に深い感じを出す影を作成し、ページ上の視覚的効果を高めることができます。

bannerAds