Jens Nistler: Halbtransparenter Tabellehintergrund

Hallo zusammen ...

ich habe folgendes Problem:
In einer Tabelle soll der Hintergrund halbtransparent sein, aber der Inhalt (nur Text) sollte voll sichtbar sein.
Fuer den Transparenzeffekt benutze ich CSS:
.trans
  {
  -moz-opacity: 40%;
  filter: Alpha(Opacity=40, FinishOpacity=40);
  }

dadurch bekomme ich zwar den Hintergrund halbtransparent, allerdings nimmt die Schrift im Tabelleninhalt diesen Effekt auch an.
Ich habe schon versucht die Schrift in einen eigenen Container (<div>) zu setzen und diesem die volle Opacity zuzuweisen, allerdings vergeblich.
Wenn einer von Euch weiter weiss waere mir sehr geholfen.

danke, jens

  1. Kannst du mal bitte ein ganzes Beispiel hier darstellen? Danke!
    Ich könnte dir auch helfen!

    1. Kannst du mal bitte ein ganzes Beispiel hier darstellen? Danke!
      Ich könnte dir auch helfen!

      gerne ...
      http://www.macebo.de/swem/index.php?page=warplaner

      1. Hübsche Seite nur etwas viele Bilder :)

        ja keine Ahnung irgendwie klappts bei mir auch net!
        habs so probiert:

        <style type="text/css">
        .trans
        {
         alpha(Opacity=40, FinishOpacity=40);
            moz-opacity: 40%;
        }
        .test
        {
            FONT-SIZE: 11px;
            COLOR: #FFFFFF;
            FONT-FAMILY: Tahoma, Verdan, Helvetica, Sans-Serfif;
        }

        </style>
        </HEAD>
        <BODY bgcolor="#000000">
        <table class="trans">
        <tr>
         <td align="center" background="back_7.gif"><div class='test'>Text :)</div></td>
        </tr>
        </table>

        1. genau so hatte ich es auch probiert, aber er nimmt den alpha-wert auch in das div mit ...

          btw: danke fuers lob ... aber das design ist nicht von mir ... ich bin nur der programmierer ;)

          1. Hallo Jens,

            genau so hatte ich es auch probiert, aber er nimmt den alpha-wert auch in das div mit ...

            Ja, mit dem Prob hab ich mich auch schon stundenlang rumgeschlagen.
            Aber immer wenn man der äußeren Tabelle eine Transparenz gibt, wird das gnadenlos "vererbt". Weder divs noch tabellen in der td noch sonstwas hat bei mir geholfen.
            Das einzige was funktioniert, sind 2 divs per z-index übereinander. Das hintere ransparent, das vordere dann solid.

            Falls es doch eine Lösung gibt, wäre ich auch interessiert :-)

            Grüße aus Nürnberg, HarryS

            1. Hallo Harry,

              Falls es doch eine Lösung gibt, wäre ich auch interessiert :-)

              Wie wäre es mit einem PNG mit Alphakanal als Hintergrundbild?

              Grüße,

              Chris "ja, ich weiß, das geht nicht im IE" tian

              --
              Sollen sich alle schämen, die gedankenlos sich der Wunder der Wissenschaft und Technik bedienen und nicht mehr davon erfasst haben als eine Kuh von der Botanik der Pflanzen, die sie mit Wohlbehagen frisst.
                                    -- Albert Einstein
              1. Hallo Christian

                Falls es doch eine Lösung gibt, wäre ich auch interessiert.

                Bin ich immer noch ;-)

                Wie wäre es mit einem PNG mit Alphakanal als Hintergrundbild?

                Bei Bildern ja, aber wenn ich nur einen farbigen BG haben will, wäre das doch Overkill oder? Ok es ginge, mit den vielgescholtenen und trotzdem beliebten (zumindest in der präCSS zeit) 1pixel images.

                Chris "ja, ich weiß, das geht nicht im IE" tian

                Du sagst es, und solange noch mehr als 0,1% mit IE surfen (ich weiß, jetzt träume ich) muß man halt auf diese Minderheit *bg* Rücksicht nehmen.

                Grüße aus Nürnberg, HarryS

                1. Hallo Harry,

                  Wie wäre es mit einem PNG mit Alphakanal als Hintergrundbild?
                  Bei Bildern ja, aber wenn ich nur einen farbigen BG haben will, wäre das doch Overkill oder? Ok es ginge, mit den vielgescholtenen und trotzdem beliebten (zumindest in der präCSS zeit) 1pixel images.

                  Was ist an einem 1pixel-Bild problematisch? Es wird immerhin über CSS eingebunden und nicht über <img> und hat somit gar keine semantische Bedeutung. Einen anderen Kritikpunkt gegen Blindgifs kenne ich nicht. (lasse mich aber gerne belehren ,-))

                  Chris "ja, ich weiß, das geht nicht im IE" tian
                  Du sagst es, und solange noch mehr als 0,1% mit IE surfen (ich weiß, jetzt träume ich) muß man halt auf diese Minderheit *bg* Rücksicht nehmen.

                  Naja, falls der IE 7 das dann doch können wird, dann kann man das ja eventuell in 1 Jahr schon so einsetzen. *hoff*

                  Grüße,

                  Christian

                  --
                  Sollen sich alle schämen, die gedankenlos sich der Wunder der Wissenschaft und Technik bedienen und nicht mehr davon erfasst haben als eine Kuh von der Botanik der Pflanzen, die sie mit Wohlbehagen frisst.
                                        -- Albert Einstein
                  1. Hallo Christian,

                    Was ist an einem 1pixel-Bild problematisch? Es wird immerhin über CSS eingebunden und nicht über <img> und hat somit gar keine semantische Bedeutung. Einen anderen Kritikpunkt gegen Blindgifs kenne ich nicht. (lasse mich aber gerne belehren ,-))

                    Stimmt, da hast Du recht. Hab ich jetzt garnicht dran gedacht, daß man das ja mit background:url(...) einbinden kann.

                    Naja, falls der IE 7 das dann doch können wird, dann kann man das ja eventuell in 1 Jahr schon so einsetzen. *hoff*

                    Oh der kann das ganz bestimmt, aber er macht mit Sicherheit dabei was flasch. Lassen wir uns überraschen.

                    Grüße aus Nürnberg, HarryS

                    1. Hallo Harry,

                      Naja, falls der IE 7 das dann doch können wird, dann kann man das ja eventuell in 1 Jahr schon so einsetzen. *hoff*
                      Oh der kann das ganz bestimmt, aber er macht mit Sicherheit dabei was flasch. Lassen wir uns überraschen.

                      Microsoft könnte doch libpng nehmen, dessen Lizenz erlaubt doch das einbinden in proprietäre Software, zumindest soweit ich das kapiert habe. (die ist ziemlich unübersichtlich) Dann wäre die PNG-Unterstützung zumindest auf Mozilla-Stand. (Mozilla verwendet ja auch libpng, oder?)

                      Grüße,

                      Christian

                      --
                      Sollen sich alle schämen, die gedankenlos sich der Wunder der Wissenschaft und Technik bedienen und nicht mehr davon erfasst haben als eine Kuh von der Botanik der Pflanzen, die sie mit Wohlbehagen frisst.
                                            -- Albert Einstein
                      1. Hallo Christian

                        Microsoft könnte doch libpng nehmen, dessen Lizenz erlaubt doch das einbinden in proprietäre Software, zumindest soweit ich das kapiert habe. (die ist ziemlich unübersichtlich) Dann wäre die PNG-Unterstützung zumindest auf Mozilla-Stand. (Mozilla verwendet ja auch libpng, oder?)

                        Äääh, libpng(?) sorry noch nie gehöhrt *dummdreinschau*

                        Grüße aus Nürnberg, HarryS

                        1. Hallo Harry,

                          Äääh, libpng(?) sorry noch nie gehöhrt *dummdreinschau*

                          <linksetzer>
                          http://www.libpng.org/pub/png/libpng.html
                          </linksetzer>

                          Grüße,

                          Christian

                          --
                          Sollen sich alle schämen, die gedankenlos sich der Wunder der Wissenschaft und Technik bedienen und nicht mehr davon erfasst haben als eine Kuh von der Botanik der Pflanzen, die sie mit Wohlbehagen frisst.
                                                -- Albert Einstein
                          1. Hallo Christian,

                            <linksetzer>
                            http://www.libpng.org/pub/png/libpng.html
                            </linksetzer>

                            Jaaaaaaa, ähem, räusper, mal so gesagt: sehr komplex :) muß man mal in ner ruhigen Stunde anschauen. Bookmark ist gesetzt.

                            Grüße aus Nürnberg, HarryS

                  2. Hi Christian,

                    Was ist an einem 1pixel-Bild problematisch?

                    hast du schonmal ausprobiert, einen Hintergrund aus sich wiederholenden 1px-Bildern im Browser zusammensetzen zu lassen? Wenn ja, hast du dann die Seite mal gescrollt? Mit Mini-Bildern bringt man jede Engine in's Schwitzen, besser ist es, ein größeres Bild zu verwenden, das sich nicht so oft wiederholt. Bei guter Komprimierung ist der Preis für schnelles Scrollen äußerst gering. Freilich abgesehen davon, dass PNGs mit (Teil-)Transparenzen den Seitenaufbau merklich verlangsamen - bei mehreren, die sich überlagern, kannst du in Mozilla die fps beim Scrollen mit freiem Auge zählen ;)

                    LG Roland

                    --
                    Warum schreibst *DU* keinen Beitrag? Fauler Sack. Konsument!
                    http://aktuell.de.selfhtml.org/tippstricks/beitrag.htm
                    1. Hallo Roland,

                      hast du schonmal ausprobiert, einen Hintergrund aus sich wiederholenden 1px-Bildern im Browser zusammensetzen zu lassen?

                      Ehrlich gesagt: nein. ;-)

                      Wenn ja, hast du dann die Seite mal gescrollt?

                      Erst recht nicht... Oh oh, ich sehe schon, das wird problematisch...

                      Mit Mini-Bildern bringt man jede Engine in's Schwitzen, besser ist es, ein größeres Bild zu verwenden, das sich nicht so oft wiederholt.

                      Gut, da hast Du sicherlich recht.

                      Bei guter Komprimierung ist der Preis für schnelles Scrollen äußerst gering.

                      Jepp, PNG kann sogar AFAIK 1-bit-Farbtiefe. (schade, dass 1/2-bit nicht geht...)

                      bei mehreren, die sich überlagern, kannst du in Mozilla die fps beim Scrollen mit freiem Auge zählen ;)

                      Och, da brauche ich keine Habltransparenten PNGs zu, Fabians Sonnensystemdemo ([pref:t=31028&m=167551]) reicht schon. (1/2 fps.... auf einem Athlon 1400 mit 256 MB DDR-RAM.... *warum-kommt-opera-für-linux-immer-nur-zeitversetzt-raus?*)

                      Warum schreibst *DU* keinen Beitrag? Fauler Sack. Konsument!

                      http://aktuell.de.selfhtml.org/tippstricks/php/verzeichnisse/

                      Grüße,

                      Christian

                      --
                      Sollen sich alle schämen, die gedankenlos sich der Wunder der Wissenschaft und Technik bedienen und nicht mehr davon erfasst haben als eine Kuh von der Botanik der Pflanzen, die sie mit Wohlbehagen frisst.
                                            -- Albert Einstein