背景画像を反転させる方法

背景画像を反転させる方法

いつもお世話になっています。
今、趣味のサイトの再構築に伴い、ネットや本を見ながらHTMLとCSSについて勉強中です。
そこでcssの記述について教えて頂きたいのです。


背景の画像を右下に固定する場合、cssの記述は、

body{
background-image:url("×××.gif");
background-repeat:no-repeat;
background-attachment:fixed;
background-position:right bottom;
}

としますよね？

後、cssで画像を左右反転させる場合は、classでfilter: fliph()を使えばいいとわかりました。

ではこの反転させた画像を背景に使いたい場合、どうすればいいのでしょう？
そもそもそのようなことが可能なのでしょうか？

もし可能でしたら具体的にどのような記述をすればいいのか教えて頂きたいのです。

それとfilterはIE独特の要素と聞いていますが、filter: fliphもそうなのでしょうか？
しかしながらfilter: alphaに関しては

filter: alpha(opacity=70);
-moz-opacity: 0.7;
opacity: 0.7;

と記述すればFirefoxなどでも透明効果が出るようです。

filter: fliphもIE独特の要素ならばfilter: alphaのように他のブラウザでも対応させる方法があるのでしょうか？


長々と書いてしまいましたが、知りたいことを要約すると

１．cssで画像を反転させ、それを背景画像に使うことは可能か否か
　　可能ならばどう記述すればよいのか

２．filter: fliphで画像を反転させた場合、IE以外でのブラウザで反映されるか否か
　　また反映されないのなら、対応させる方法はあるのかどうか

と言うことです。

１と２、分かる方だけでも結構ですのでよろしくお願いします。

No.1 ベストアンサー 回答者： yyr446 回答日時： 2010/03/26 16:50

1.否

2.否

対応策は予め反転させた画像を別途作っておく事です。

この回答へのお礼

やっぱり否ですか。
できないとはっきり分かったのですっきりしました。
回答ありがとうございました。

お礼日時：2010/03/29 12:43

No.2 回答者： ayustar 回答日時： 2010/03/28 22:29

本来の質問についてはすでに回答が出ているので、opacityの補足。

opacity: 0.7;
これが本来の、CSSでの透明効果の指定です。

filter: alpha(opacity=70);
上記がIEでは効かないため、IE用の指定（フィルター）です。

-moz-opacity: 0.7;
Firefoxの古いバージョンのための指定です。
現行バージョンではopacityに移行したので、書く必要は無いようです。

お節介、失礼致しました。

参考URL：http://htmlandcss.seesaa.net/category/7723184-1. …

この回答へのお礼

解説ありがとうございました。
ブラウザによって解釈が違ったりするので苦労しています。
回答ありがとうございました。

お礼日時：2010/03/29 12:44