• 締切済み

filter:alphaを一部無効にする方法ってないでしょうか？

CSSのfilter : alphaで半透明にしたテーブルの中に画像を表示させようと思っています。 でもそうするとその画像まで半透明で表示されますよね。画像によってはとても見えにくくなってしまうので、画像部分だけfilter : alphaを無効にしたいのですが、不可能なのでしょうか？

みんなの回答

回答No.1

単純にその画像に filter:alpha(Opacity=100); をしていすればいいのでは？

raynya
質問者

お礼

回答有難うございます。 やってみたのですが、背景が透けてしまいます…。

  1. カテゴリ
  2. インターネット・Webサービス
  3. インターネット接続・通信
  4. レンタルサーバ・ASP

関連するQ&A

  • Ａｌｐｈａフィルタについて

    　こんにちは。質問させてください。 現在、alphaフィルタを使って、画像の背景を半透明にしたいと思っているのですが、どうしてもできません。 （確認はie6.0でも5.5でも行っています） ソースはタグ辞典を見ながら、下のようなものを組みました。 どこか間違っているでしょうか？ お教え頂ければうれしいです。 よろしくお願い致します！ <html> <head> <meta http-equiv="Content-STYLE-Type" content="text/css; charset=Shift_JIS"> <title>無題ドキュメント</title> <style type="text/css"> <!-- .alpha1{ filter:progid:DXImageTransform.Microsoft.alpha(style=2,opacity=100, finishopacity=40); } .alpha2{ filter:progid:DXImageTranceform.Microsoft.alpha(style=2,opacity=100, finishopacity=0); } --> </style> </head> <body bgcolor="#FFFFFF" text="#000000"> <img src="/jsg41044.jpg" width="700" height="466" class="alpha2"> </body> </html>

    • ベストアンサー
    • CSS
  • 一部CSSを無効にする

    数ページのテーブルをcssファイルを使って半透明化させ背景が薄く見えるようにしています。 そこでテーブル自体だけでなくテーブル内の画像や文字も半透明化されるのですが、あるページのテーブル内にある数枚の画像のみを半透明化したくない場合、どのように書けば良いですか？ CSSはあまり、というか全く詳しくなくて、idやclassというのも調べてみたのですが、 目的のものに辿りつけず…困っています。宜しくお願いします。

    • ベストアンサー
    • HTML
  • ＪａｖａＳｃｒｉｐｔでＩＥの半透明機能の設定方法

    画像をボタンを押すことで、通常画像→半透明→透明→繰り返し・・ といったことをしてみたいのですが、 ＣＳＳのＦｉｌｔｅｒの「Ａｌｐｈａ」を使えばいいのでは・・・ というところまでは来ているのですが、 ＪａｖａＳｃｒｉｐｔでの記述方法がよく分かりません。 ＨＴＭＬでの記述もよく分からないので、どちらかでも結構です。 よろしければ、どうぞ宜しくお願いします。

  • tableを半透明にする件

    tableを個別に透明にする設定などはわかったのですがテーブルの中身 の文字や画像まで透明になるのを防ぐ方法はないでしょうか？ 返信お待ちしています。 <STYLE TYPE="text/css"> <!-- TABLE{filter:Alpha(opacity=50);} --> 個別に下記タグで透明度を設定しています。 </STYLE> style="filter:Alpha(opacity=50);"

  • 外部CSSです。テーブルにスタイルを適用したいのですが・・・。

    ほとんど初心者です。 filter:Alpha(opacity=75)で、半透明にしたいんです。 個別に設定するところまではできたのですが、 外部CSSの方に記述する際、どうしたらいいのかがわかりません。 table,td,th{ font-size : 12px; style="filter:Alpha(opacity=75)"; } と、まずはやってみたのですが間違っているようで＾＾； 一応、普通のテーブルとは分けたいので ”table75”と、名前をつけたいのですが、可能でしょうか？ どう記述したらいいか、どうかアドバイスお願い致します！

    • ベストアンサー
    • HTML
  • 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> 【ＣＳＳ】 .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プロパティで不透明を１００に戻すような設定をしてみましたが適用されません。 *************************　【変更後】　*********************** 【XHTML】 <div class="test1"><div class="test2">テキスト</div></div> 【ＣＳＳ】 .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タグで囲って不透明１００に設定 } ******************************************************* ご指導のほどよろしくお願いします。

    • ベストアンサー
    • CSS
  • 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
  • 背景画像を反転させる方法

    背景画像を反転させる方法 いつもお世話になっています。 今、趣味のサイトの再構築に伴い、ネットや本を見ながら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以外でのブラウザで反映されるか否か 　　また反映されないのなら、対応させる方法はあるのかどうか と言うことです。 １と２、分かる方だけでも結構ですのでよろしくお願いします。

    • ベストアンサー
    • HTML
  • cssのalphaついて

    サイト作成について質問です。 CSSでtdにalphaをかけると中に在る文字まで薄くなってしまいます。 背景色のみ薄くして文字色はそのままにすることはできないのでしょうか？ 探してみてもこの質問は見あたらなかったのですがもし既出であったら申し訳ございません。

    • ベストアンサー
    • HTML
  • 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

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する