kostenloser Webspace werbefrei: lima-city


Transparenten Hintergrund

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    seth93

    seth93 hat kostenlosen Webspace.

    Hi,
    ich hab ein Hintergrund und dann noch ein Divcontainer mit einem Hintergrund.Dieser soll aber durchsichtig sein.
    Wie mach ich das?
    -moz ....
    Hab ich mal irgendwo gesehen.
    Es soll aber in eine externe CSS-Datei rein.
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. in die externe css einfach folgendes schreiben:

    .divname {
    background: transparent;
    }



    Beitrag geändert: 28.9.2008 13:06:16 von alphara
  4. Autor dieses Themas

    seth93

    seth93 hat kostenlosen Webspace.

    Ok, aber darf ich dann noch background-image: haben?
  5. So wie ich das jetzt verstehe möchtest du, dass das Hintergrundbild es div-containers einen Wasserzeicheneffekt hat, also teilweise durchsichtig ist. Dazu würde ich am besten, diese Bild teilweise durchsichtig machen. Grafikprogramme wie Gimp, Photoshop und Co. können sowas machen. Du musst es dann als .png abspeichern, da dieses Format "teilweise Transparenz" besitzt.

    Es gibt auch die Möglichkeit, das über CSS zu lösen, jedoch ist das Browserabhängig und bei dem was du meinst, würde z.B. Internet Explorer, das Bild nicht transparent anzeigen!

    LG
  6. Autor dieses Themas

    seth93

    seth93 hat kostenlosen Webspace.

    http://nghi.ng.ohost.de/wedding/frau.php
    Das ist ein Test.
    Da ist doch ein schwarzer Rahmen.
    Da soll ein Bild oder Farbe rein, nur Transperent.
  7. Ich würde den Hintergrund einfach mit Gimp erstellen, und die später transparenten Bereiche transparent machen (vollständig oder teilweise).

    Dann einfach als .png abspeichern und mit background-image:url(datei.png); einbinden.

    Dann freuen, dass es geht:biggrin:

    Gruß, Prog
  8. prog schrieb:
    Ich würde den Hintergrund einfach mit Gimp erstellen, und die später transparenten Bereiche transparent machen (vollständig oder teilweise).

    Dann einfach als .png abspeichern und mit background-image:url(datei.png); einbinden.

    Dann freuen, dass es geht:biggrin:

    Gruß, Prog


    Genau das sagte ich doch:P
    Selbst wenn da nur eine Farbe rein soll, die teilweise transparent ist, reicht es eine 1x1 px große Grafik zu erstellen und dort mit der Farbe, je nachdem wie viel Deckkraft sie haben soll, zu füllen. Wichtig ist dass es als PNG gespeichert wird!
  9. Autor dieses Themas

    seth93

    seth93 hat kostenlosen Webspace.

    Ok, ich hab zwar Photoshop, aber ich hab damit nur n bisschen rumexperimentiert.
    Wie mach ich denn die Grafik transperent?
  10. Hast du schon ein Bild?
    Wenn ja: Es sollte irgendwo ne Option Deckkraft geben. Dort wo du auch die Ebenen findest, schätze ich. Dann kannst du von 100% etwas herunter regulieren.
    Wenn nein: Erstell ein neues Dokument und fülle es mit der gewünschten Farbe/Bild, dann wieder wie oben beschrieben, Deckkraft der Ebene suchen und reduzieren.

    In beiden Fällen "speichern unter" und als Format .png wählen!
  11. Autor dieses Themas

    seth93

    seth93 hat kostenlosen Webspace.

    Ich hab das mit Deckkraft jetzt gesehen, nur kann ich den Hintergrund nicht verändern.
    Wenn ich eine neue Ebene einfüge, dann kann ich die Deckkraft davon verändern, aber vom Hintergrundbild nicht.
  12. Hm. Es könnte sein, dass Hintergrundebenen was "Besonderes" sind und man deshalb nicht die Deckkraft so einfach ändern kann. Versuch mal einen von den beiden Optionen:

    1. Öffne dein Bild, kopiere es und lege ein neues Dokument an in das du das Bild kopierst. Wenns dann nicht Hintergrund ist, dann kann man die Deckkraft ja verändern!

    2. Schau mal ob man nicht einstellen kann, dass es nicht die Hintergrundebene ist, also vllt. Einstellungen oder dort wo die Ebenen sind.. Kenn mich damit eigentlich nicht aus..
  13. Autor dieses Themas

    seth93

    seth93 hat kostenlosen Webspace.

    Ahhh, man kann "Ebene aus Hintergrund" machen.
    Ok, dann ist das Bild transperent ^^
    Aber ob s auf der Seite dann nicht doch den Hintergrund verdeckt .


    Danke erstmal.


    EDIT:
    Hab das Bild erstellt und bin mir nicht sicher ob das auch wirklich transperent ist ^^
    Bin grad nicht zu Hause und kann das deshalb nicht überprüfen.
    Geht filter:alpha(opacity=75); -moz-opacity: 0.75; denn nicht?


    Beitrag geändert: 28.9.2008 18:03:25 von seth93
  14. Hier [http://www.css4you.de/trickkiste/tr00018.html] steht was darüber. Das sollte dann für die meisten Browser funktionieren. Trotzdem rate ich eigentlich, dass durch ein Bild zu machen, da eben nicht alle Browser abgedeckt werden uns es sehr ärgerlich wäre, wenn ein Bild den Inhalt verdeckt!
  15. malia

    Moderator Kostenloser Webspace von malia

    malia hat kostenlosen Webspace.

    Hier steht auch noch etwas darüber:

    http://www.css4you.de/moz-opacity.html

    ich habe mal selber damit herumexperimentiert war einfach nur Spielerei:

    http://malia.lima-city.de/ozean/ozean.php

    sehen kann man den Effekt aber nicht in allen Browsern, deswegen würde ich davon abraten.

    Grüsse Malia


    Beitrag geändert: 28.9.2008 21:37:51 von malia
  16. Autor dieses Themas

    seth93

    seth93 hat kostenlosen Webspace.

    Danke, bei mir klappt s mit Mozilla und IE.
    Wie sieht es denn aus wenn es nicht klappt?
    Ich kann das leider nicht nachprüfen.


    EDIT:
    Am Anfang fiel das Wort Wasserzeichen.
    Wie macht man das denn ^^

    Beitrag geändert: 29.9.2008 7:32:40 von seth93
  17. malia

    Moderator Kostenloser Webspace von malia

    malia hat kostenlosen Webspace.

    Es hat bei mir mit dem Opera nicht geklappt, es ist mit diesem Browser nicht transparent.

    Wasserzeichen mache ich wenn überhaupt damit:

    http://www.bildschutz.de/

    Grüsse Malia
  18. Zur Ergänzung: In HTML bezeichnet man als Wassserzeichen-Effekt, wenn man einem Bild die Eigenschaft fixed gibt, z.B.
    background: url(bild.jpg) fixed;

    Hier [http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_attachment] wird das näher erläutert.

    Um verschiedene Browser zu testen, empfehle ich die Seite http://browsershots.org/. Dort kann man einfach auswählen, von welchen Seiten ein Browsershot gemacht werden soll. Allerdings funktioniert das nicht so gut bei Seiten mit Werbung, da die Werbung im Endeffekt die ganze Seite bedeckt!

    Lg
  19. Autor dieses Themas

    seth93

    seth93 hat kostenlosen Webspace.

    Ok,danke für die Links und für die Hilfe.
  20. s***x

    ich würd mit css3 arbeiten statt mit moz-spezifischen css-befehlen.
    http://www.css3.info/preview/opacity/
    mit opacity kannst du das komplette element tranzparent machen. zur not amchste dann 2 übereinander wenn die schrift nicht tranzparent sein soll
  21. Autor dieses Themas

    seth93

    seth93 hat kostenlosen Webspace.

    Ja, das mti der Schrift hat mich genervt.
    Meinste ich soll den Text außerhalb von Div machen?
    Und den Backgroudn von Div dann transperent und den Text dann da raufschieben?
  22. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!