blur()
blur() は CSS の関数で、入力画像にガウシアンぼかしを適用します。返値は <filter-function> です。
試してみましょう
構文
css
blur(radius)
引数
radius-
ぼかしの半径で、
<length>で指定します。ガウス関数の標準偏差の値を定義します。つまり、画面上のピクセルをいくつ互いに混合するかということです。すなわち、大きい値になるほどよりぼかしが入ります。0の値は入力を変更しません。補間時の欠損値は0です。
例
ピクセル数と rem を用いた blur の設定
css
blur(0) /* 効果なし */
blur(8px) /* 半径 8px でぼかす */
blur(1.17rem) /* 半径 1.17rem でぼかす */
仕様書
| Specification |
|---|
| Filter Effects Module Level 1 # funcdef-filter-blur |
ブラウザーの互換性
BCD tables only load in the browser