■ ヒントだよ！HTML & CSS ■
■ CSS の 例(フィルターをかける)
- 書式
- {backdrop-filter:効果;}
■ ぼかし(blur)/シャドウ(drop-shadow)/透明化(opacity)
| 元画像 | blur |
 | |
| drop-shadow | opacity |
| |
- CSS
-
td { text-align: center; }
.f_blur { filter: blur(5px); }
.f_dropshadow { filter: drop-shadow(5px 5px 10px #ff0000); }
.f_opacity { filter: opacity(30%); }
- HTML
-
<table>
<tr>
<td>元画像</td>
<td>blur</td>
</tr><tr>
<td><img src="img/testsora.png"></td>
<td><img src="img/testsora.png" class="f_blur"></td>
</tr><tr>
<td>drop-shadow</td>
<td>opacity</td>
</tr><tr>
<td><img src="img/testsora.png" class="f_dropshadow"></td>
<td><img src="img/testsora.png" class="f_opacity"></td>
</tr>
</table>
© KinutaHandicraft
