• 締切済み

CSSのFilter:shadowをFireFoxで表示する方法

CSSでfilter: shadow(color=#3F1501,direction=135); と表示し、画像にドロップシャドウをつけています。 IEではちゃんと表示されるのですが、 FireFoxでは表示されません。 FireFoxでIEと同じように表示させる方法を ご存知の方、ご教授下さい!!!

みんなの回答

  • xs200
  • ベストアンサー率47% (559/1173)
回答No.1

IE独自の拡張機能ですから他のブラウザーでは表示されません。 JavaScriptでやったらどうですか。 http://allabout.co.jp/internet/javascript/closeup/CU20080325A/

関連するQ&A

  • 各ブラウザにおいて、表示できるCSSとできないCSS

    こんにちは。はじまして。 現在ブログを製作しております。 先日、http://www15.ocn.ne.jp/~mksozai/design/line.html こちらのサイトで、変わったCSSを見つけ早速ブログのデザインに生かしてみようと導入しました。 IEでは問題なく表示されるのですが、Firefoxでは効果が適用されません。。。 そのCSSは filter:alpha(opacity=100,finishopacity=0,style=1); こちらになるのですが、これをIE以外のブラウザにも効果を適用させる方法はないでしょうか? これはIEのみ表示できるCSSだと解釈するべきなのでしょうか? ご存知の方がおられましたら、教えていただけると幸いです。 よろしくおねがいします

    • ベストアンサー
    • HTML
  • 透かしをいれるCSS

    CSSを勉強していますが、分からないことがあります。 画像に透かしをいれたいと思い下記のCSSを書いたのですが、ブラウザによって表示が違います。 Firefoxでは表示できるのですが、IE8以降では表示できないのですが、何が問題なのかわかりません。 opacity: 0.8; filter: alpha(opacity=80); /* IE6、IE7対応 */ -moz-opacity: 0.8; /* Firefox1.5以前対応 */ 分かる方おられましたらお手数ですが宜しくお願いします。

    • ベストアンサー
    • CSS
  • CSS Validatorでfilterをエラーにさせないためには

    サイトのスタイルシートでfilterを指定しています。 これをW3CのCSS Validator(http://jigsaw.w3.org/css-validator/)でチェックすると、filterの部分がエラーとなってしまいます。 filterの指定は   filter: DropShadow(color=gray,offX=1,offY=1); としており、エラーは   Parse Error - color=gray,offX=1,offY=1) と表示されます。 これをエラーが出ないように指定するには、どのようにしたらよいのでしょうか。

    • 締切済み
    • CSS
  • IE7とfirefox2.0でcssによってテーブルのセルの背景の表示がfirefoxで表示されないことについて。

    cssを外部リンクで td.1-cell{ width:200px;   background:#F8F8F8; } と記述し、 <td class=1-cell> で呼び出したところ、IE7では正確に表示されているのに対して、 firefoxで背景の色が表示されず無色となってしまいます。 どうすればfirefoxとIE両方で表示できるのでしょうか。

    • ベストアンサー
    • HTML
  • filter内の画像を透過させない方法

    いつもお世話になっています。 filter内に位置する画像を透過させない方法を教えて下さい。 背景画像を上下左右に敷き詰めた場合、文字がが読みにくくなるのでfilterを使用しています。 しかしながらこの方法ではロゴや写真など透過させたくない画像までfilterがかかってしまいます。 自分でも試行錯誤を繰り返してみました。 filter効果を設定してあるdivを新しいdivで囲んで画像をpositionで指定してみたところ、IEではロゴが透過しませんでしたが、Firefoxではやはり透過されていました。 IEはcssなどの解釈がかなりいい加減と聞いていますので、Firefoxの表示を信用した方がいいように思われます。 Firefoxなど他のブラウザでも画像を透過させない方法はあるのでしょうか? ご存知の方、いらっしゃいましたら教えて下さい。 参考のため、ソースを下記に貼っておきます。 htmlやcssに関しては本やwebで検索しながら勉強中ですので、根本的な勘違い等あるかもしれません。 HTML部分 <body> <div id="page"> <h1><img src="image/logo.jpg" width="217" height="43" alt="My Web Site" /></h1> <div id="contents"> <div id="main"> <p>---本文---</p> </div><!-- main end --> </div><!-- contents end --> </div><!-- page end --> </body> css部分 div#page { width: 720px; margin-right: auto; margin-left: auto; padding: 0; position: relative; } div#page h1 { position: absolute; top: 50px; left: 251px; } div#contents { width: 720px; margin: 0 auto; padding: 0; text-align: left; background-color: #fff; filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; } div#main { width: 680px; margin: 0 auto; padding: 100px 20px 0 20px; }

    • ベストアンサー
    • HTML
  • firefox だけ専用のCSSを表示させたいのですが、、、

    firefox 専用のCSSを表示させたいのですが、 stylelink.js として var var_css=''; if(checkB.Mac) { if(checkB.SAF) { var_css="SAF"; } else if(checkB.IE52) { var_css="MacIE52"; } else if(checkB.IE5 || checkB.IE51 || checkB.IE6) { var_css="MacIE5"; } else if(checkB.NN6 || checkB.NN7) { var_css="MacNN6"; } else { var_css="common"; } } else if(checkB.Win) { if(checkB.IE) { var_css="IEGEK"; } else if(checkB.Win) { if(checkB.gecko) { var_css="firefox"; } else { var_css="common"; } } document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"/css/"+var_css+".css\" title=\"fontproperty\">"); としましたが 外部 firefox.css が上手く反映しません。 どうすればよいのでしょうか? 御教授をお願いいたします。

  • CSSのfilterでテキストまで透明化される

    CSSのfilterプロパティで背景色だけでなくテキストまで透明化されてしまいます。 以下のように親divの中に子divを造り、その子divにテキストを入力し、 親divに設定した背景画像が子divに透き通って見えるように 子divにfilterプロパティを設定しました。 子divの背景色(白)が透明化され親divの背景画像が見えるようになったのはいいのですが、 背景色(白)だけでなくテキスト文字まで透明化されてしまいます。 テキスト文字だけ透明化されないように設定したいです。 ブラウザチェック:windows IE 8 です。 ******************************************************* 【XHTML】 <div class="test1"><div class="test2">テキスト</div></div> 【CSS】 .test1{ width:300px; height:300px; background-image:url("image.jpg"); } .test2{ width:150px; height:50px; background-color:#ffffff; filter:alpha(opacity=30); ←背景色(白)が透明ぽくなるように設定 } ******************************************************* テキスト文字まで透明化されるので、さらにそのテキストをpタグで囲ってみましたが、 それでもテキストが透明化されている(親divのfilterがpタグまで継承されているから?)ので pタグにfilterプロパティで不透明を100に戻すような設定をしてみましたが適用されません。 ************************* 【変更後】 *********************** 【XHTML】 <div class="test1"><div class="test2">テキスト</div></div> 【CSS】 .test1{ width:300px; height:300px; background-image:url("image.jpg"); } .test2{ width:150px; height:50px; background-color:#ffffff; filter:alpha(opacity=30); ←背景色(白)が透明ぽくなるように設定 } p { filter:alpha(opacity=100); ←テキスト文字まで透明化されるのでpタグで囲って不透明100に設定 } ******************************************************* ご指導のほどよろしくお願いします。

    • ベストアンサー
    • CSS
  • firefoxで位置を正しく表示させるには?

    IEだと正常に画面の右側に表示されるんですが、FireFoxと Mozilaでは左側に表示されてしまいます。 以下が上手くいかないところです。 <div style="position:absolute; top:4px; right:2px; filter: glow(color=white);"> <a href="http://???.jp/" target="_blank"> <img src="???.gif"> </a> </div> 余談ですがfilterはIEだけなんでしょうか? (こっちも良く分かりません。) 上手くいく方法を教えてください。

    • ベストアンサー
    • HTML
  • cssのfont-sizeがFirefoxで効かない

    .css 記載したfont-sizeがFirefoxで表示すると、反映されません。IEでは、反映されます。 記載ミス?でしょうか。 colorは反映されます。 どうぞ、よろしくお願いいたします。 CSS部分 td{ color:#663300; font-size: 10pt; } html部分 <td>ああああ<td>

    • ベストアンサー
    • HTML
  • CSSで作ったページが表示されません

    CSSを使って作成したファイルが、いざファイルをアップロードすると白紙で表示されてしまいます。 OSはMac OS 10.3.9、ソフトはAdobe GoLiveCSです。 ファイル自体をSafariやIE、Firefoxにドロップすると表示出来ますが、Web上でアクセスするとFirefox以外は白紙のままです。 URLを直接打ち込んでも駄目でした。 CSSの文法自体に何か問題があるのでしょうか? どうか、よろしくお願いします。

    • ベストアンサー
    • HTML