CSSブラー()出力画像に適用されるガウスぼかし

CSSぼかし()

blur() CSSの  方法ガウスぼかし出力画像に適用される。結果  <filter-function>

ぼかし(半径

radiusぼかし半径値<length>従って、より大きな値をもたらすよりぼやけた;それはガウス関数、すなわち、一体化画面上のピクセルの数の標準偏差を規定します。0の値は、エントリが変更されないままになります。ヌル値はゼロです。

 

ぼかし(0/ * 影響なし* / 
ブラー(8px)       / * 8px半径を有するブラー* / 
ブラー(1 .17rem)   / * 1.17rem半径を有するブラー* /

 

第二に、例を使用しました:

フィルタ:ぼかし(0)。

フィルタ:ぼかし(4PX)。

フィルタ:ぼかし(1.5rem)。

 

2.例:

<!DOCTYPE html>
<html>
<head>
<style>
img {
    -webkit-filter: blur(5px); /* Chrome, Safari, Opera */
    filter: blur(5px);
}
</style>
</head>
<body>

<p>图片使用高斯模糊效果:</p>

<img src="pineapple.jpg" alt="Pineapple" width= "300" 高さ= "300" > 

< p型> < 強い>注:</ 強い> Internet Explorerは、フィルタのプロパティをサポートしていません。</ P > 

</ ボディ> 
</ HTML >

 

多く:

キャンバスファジー処理写真、すりガラス処理stackblur.jsの写真

Webページの画像は、達成するためにガラス効果をつや消し

CSS3のテキスト緩やかな統合(A)

 

おすすめ

転載: www.cnblogs.com/tianma3798/p/11331759.html