TOPページ　＞　フィルタ（特殊）効果で文字や画像を修飾する
フィルタ（特殊）効果で文字や画像を修飾する

フィルタ（特殊）効果で文字や画像を修飾する

色や大きさ、背景色や枠線といった基本的な文字や画像の修飾のほかに、よりダイナミックにこれらを修飾する方法として、フィルタ（特殊効果）があります。

ホームページやブログを個性的に演出したい方にはもってこい、といいたいところですが、これらの指定は対応していないブラウザもありますので、非対応のブラウザでは著しく見映えを損なう恐れがあります。

くれぐれもこの点には注意してご利用ください。

フィルタ（特殊）効果で文字や画像を修飾する 項目一覧

HTML言語を使用したホームページやブログなどのウェブサイトでは、文字や画像をX線をあてたような白黒に変換して表示させることができます。 この効果は、Inter...

HTML言語を使用したホームページやブログなどのウェブサイトでは、文字や画像を補色に反転して表示させることができます。 この効果は、InternetExplor...

HTML言語を使用したホームページやブログなどのウェブサイトでは、文字や画像を白黒（グレースケール）に変換して表示させることができます。 この効果は、Inter...

HTML言語を使用したホームページやブログなどのウェブサイトでは、文字や画像に発光しているような効果を持たせることができます。（発光効果） この効果は、Inte...

HTML言語を使用したホームページやブログなどのウェブサイトでは、文字や画像を上下や左右に反転させて表示することができます。 この効果は、InternetExp...

HTML言語を使用したホームページやブログなどのウェブサイトでは、文字や画像に影を投影して表示したり、影付きにして表示させたりすることができます。 この効果は、...

2006年05月23日

HTML言語を使用したホームページやブログなどのウェブサイトでは、文字や画像をX線をあてたような白黒に変換して表示させることができます。

この効果は、InternetExplorer専用ですので、多くのブラウザで見映えを統一したい方にはお勧めしません。

<タグ名 style="position:absolute;filter:Xray(パラメータ)>～</タグ名>
  1. タグ名：DIV および SPAN タグが使用できます。
  2. パラメータ：『パラメータ名 = 値』という形式で指定します。指定できるパラメータは enable のみですので、通常省略します。
    パラメータ名値の範囲と意味
    enabledtrue ならフィルタ効果有効、false なら無効

サンプルです。IE以外のブラウザでご覧の方には、意図通り表示されておりません。

続きを読む "文字や画像をX線をあてたような白黒で表示する" »

投稿者: Melody 日時: 10:02 | 　[ブログでもだいたい使えるHTMLタグ リファレンスTOPへ]

HTML言語を使用したホームページやブログなどのウェブサイトでは、文字や画像を補色に反転して表示させることができます。

この効果は、InternetExplorer専用ですので、多くのブラウザで見映えを統一したい方にはお勧めしません。

<タグ名 style="position:absolute;filter:GrayInvert(パラメータ)>～</タグ名>
  1. タグ名：DIV および SPAN タグが使用できます。
  2. パラメータ：『パラメータ名 = 値』という形式で指定します。指定できるパラメータは enable のみですので、通常省略します。
    パラメータ名値の範囲と意味
    enabledtrue ならフィルタ効果有効、false なら無効

サンプルです。IE以外のブラウザでご覧の方には、意図通り表示されておりません。

続きを読む "文字や画像を補色に反転する" »

投稿者: Melody 日時: 09:39 | 　[ブログでもだいたい使えるHTMLタグ リファレンスTOPへ]

HTML言語を使用したホームページやブログなどのウェブサイトでは、文字や画像を白黒（グレースケール）に変換して表示させることができます。

この効果は、InternetExplorer専用ですので、多くのブラウザで見映えを統一したい方にはお勧めしません。

<タグ名 style="position:absolute;filter:Gray(パラメータ)>～</タグ名>
  1. タグ名：DIV および SPAN タグが使用できます。
  2. パラメータ：『パラメータ名 = 値』という形式で指定します。指定できるパラメータは enable のみですので、通常省略します。
    パラメータ名値の範囲と意味
    enabledtrue ならフィルタ効果有効、false なら無効

サンプルです。IE以外のブラウザでご覧の方には、意図通り表示されておりません。

続きを読む "文字や画像を白黒で表示する" »

投稿者: Melody 日時: 09:28 | 　[ブログでもだいたい使えるHTMLタグ リファレンスTOPへ]

HTML言語を使用したホームページやブログなどのウェブサイトでは、文字や画像に発光しているような効果を持たせることができます。（発光効果）

この効果は、InternetExplorer専用ですので、多くのブラウザで見映えを統一したい方にはお勧めしません。

<タグ名 style="position:absolute;filter:Glow(用パラメータ)>～</タグ名>
  1. タグ名：DIV および SPAN タグが使用できます。
  2. パラメータ：下記の中から指定できます。『パラメータ名 = 値』という形式で指定します。複数のパラメータを指定する場合は、半角カンマで区切って併記してください。
    パラメータ名値の範囲と意味
    color発光部分のカラー名称またはカラー番号
    strength発光強度
    enabledtrue ならフィルタ効果有効、false なら無効
    カラーについて、詳しくはこちら→『16進数カラー見本』

サンプルです。IE以外のブラウザでご覧の方には、意図通り表示されておりません。
発光効果が分かりやすいよう、背景色を黒にしています。

続きを読む "文字や画像を発光して表示させる（発光効果）" »

投稿者: Melody 日時: 07:16 | 　[ブログでもだいたい使えるHTMLタグ リファレンスTOPへ]

2006年04月23日

HTML言語を使用したホームページやブログなどのウェブサイトでは、文字や画像を上下や左右に反転させて表示することができます。

この効果は、InternetExplorer専用ですので、多くのブラウザで見映えを統一したい方にはお勧めしません。

左右に反転する
<タグ名 style="position:absolute;filter:FlipH(パラメータ)>～</タグ名>
上下に反転する
<タグ名 style="position:absolute;filter:FlipV(パラメータ)>～</タグ名>
  1. タグ名：DIV および SPAN タグが使用できます。
  2. パラメータ：『パラメータ名 = 値』という形式で指定します。指定できるパラメータは enable のみですので、通常省略します。
    パラメータ名値の範囲と意味
    enabledtrue ならフィルタ効果有効、false なら無効

サンプルです。IE以外のブラウザでご覧の方には、意図通り表示されておりません。

続きを読む "文字や画像を反転させて表示する" »

投稿者: Melody 日時: 00:17 | 　[ブログでもだいたい使えるHTMLタグ リファレンスTOPへ]

2006年04月22日

HTML言語を使用したホームページやブログなどのウェブサイトでは、文字や画像に影を投影して表示したり、影付きにして表示させたりすることができます。

この効果は、InternetExplorer専用ですので、多くのブラウザで見映えを統一したい方にはお勧めしません。

他のブラウザでも影付きにして表示させたい方は、こちらの方法をおすすめします。→『表示位置の指定を使って文字を影付きにする』

影を投影する
<タグ名 style="position:absolute;filter:Dropshadow(ドロップシャドウ用パラメータ)>～</タグ名>
影付き文字にする
<タグ名 style="position:absolute;filter:Shadow(シャドウ用パラメータ)>～</タグ名>
  1. タグ名：DIV および SPAN タグが使用できます。
  2. ドロップシャドウ用パラメータ：下記の中から指定できます。『パラメータ名 = 値』という形式で指定します。複数のパラメータを指定する場合は、半角カンマで区切って併記してください。
    パラメータ名値の範囲と意味
    color影のカラー名称またはカラー番号
    offXX（横方向）のオフセット値
    offYY（横方向）のオフセット値
    positivetrue なら通常の影付き、false ならカットアウト表示
    enabledtrue ならフィルタ効果有効、false なら無効
    カラーについて、詳しくはこちら→『16進数カラー見本』
  3. シャドウ用パラメータ：下記の中から指定できます。複数のパラメータを指定する場合は、半角カンマで区切って併記します。
    パラメータ名値の範囲と意味
    color影のカラー名称またはカラー番号
    direction影の方向。0、45、90...というように45°単位で指定
    enabledtrue ならフィルタ効果有効、false なら無効

サンプルです。IE以外のブラウザでご覧の方には、意図通り表示されておりません。

続きを読む "文字や画像に影をつける" »

投稿者: Melody 日時: 22:47 | 　[ブログでもだいたい使えるHTMLタグ リファレンスTOPへ]

IEの方はこちらから当サイト ブックマークできます。
ランキング参加中!お役に立てたら クリックをお願いします。
当サイト掲載カテゴリは
Yahoo! JAPAN コンピュータとインターネット > データ形式 > HTML > リファレンス