サイト内検索
...スタイルシート(css)...
スタイルシート・フィルタ
複数の効果を使う
- 複数の効果を使うフィルタは、basicimageプロパティを指定します。
- 複数のフィルタを同時に指定する場合は、半角スペースで区切って書きます。
- [使い方]
- ［スタイルシート]
- .sample{
filter: basicimage(mask=数値, invert=数値, maskcolor=カラーコード番号);
} - ［ｂｏｄｙの中］
- <img src="../img/sample.jpg" class="sample">
- ＩＥのみに対応しています。
- [メモ]
- プロパティprogidは、
- W3C・CSS検証サービスでは、推奨されていません。
| プロパティ名 | 値 | 説明 |
|---|---|---|
| mirror | 0 (0) | 左右反転しない。 |
| 1 | 左右反転します。 | |
| rotation | 0 (0) | 回転しない。 |
| 1 | 時計回りに90°回転 | |
| 2 | 時計回りに180°回転 | |
| 3 | 時計回りに270°回転 | |
| invert | 0 (0) | 色を反転しない。 |
| 1 | 色を反転します。 | |
| grayscale | 0 (0) | 白黒にしない。 |
| 1 | 白黒にします。 | |
| xray | 0 (0) | 反転して白黒にしない。 |
| 1 | 反転して白黒にします。 | |
| opacity | 0.00〜1.00 (1.00) | 不透明度を指定します。(0=透明) |
| mask | 0 (0) | 透明・不透明を反転させない。 |
| 1 | 透明・不透明を反転させます。 | |
| maskcolor | カラーコード番号 | 反転させたときの色(mask=1の時のみ) |
| enabled | 0/false (1) | フィルタを実行しない。 |
| 1/true | フィルタを実行します。 |
サンプル
| フィルタを使用していない状態 |
|---|
<img src="../img/sample.jpg" alt="画像" width="120" height="90"> |
|
☆★文字★☆
<div style="font: bold 170% sans-serif; width: 100%;">
|
《ｂｏｄｙに直接書いた場合》
| 複数の指定をした場合 |
|---|
|
<div style="width: 100%;
|
|
☆★文字★☆
<div style="font: bold 170% sans-serif; color: blue;
|