filterプロパティのMotionBlur()は、方向を指定してぶれさせる際に使用します。
filter:blur()の書式で指定する場合には、paddingプロパティでブレ部分のスペースを確保してやる必要があります。
p.sample1 img {
filter:progid:DXImageTransform.Microsoft.MotionBlur(Strength=10, Direction=135);
}
p.sample2 img {
filter:blur(Strength=10, Direction=135);
padding:10px;
}
<html>
<head>
<link rel=”stylesheet” href=”sample.css”
type=”text/css”>
</head>
<body>
<p>
filterプロパティを適用していない画像<br>
<img src=”https://www.htmq.com/wp-content/themes/htmq/htmq-images/kaeru.gif”>
</p>
<p class=”sample1″>
フィルタ効果MotionBlur()<br>
<img src=”https://www.htmq.com/wp-content/themes/htmq/htmq-images/kaeru.gif”>
</p>
<p class=”sample2″>
フィルタ効果blur()<br>
<img src=”https://www.htmq.com/wp-content/themes/htmq/htmq-images/kaeru.gif”>
</p>
</body>
</html>
filterプロパティを適用していない画像
フィルタ効果MotionBlur()
フィルタ効果blur()