Problem mit Hintergrund

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Problem mit Hintergrund

    Moin Junx,
    ich habe mir neulich mit Photoshop ein einfaches Design erstellt: Klick
    Da ich jedoch nicht sehr viel mit HTML mache habe ich ein Problem.
    In die Mitte der Seite soll ja der Text, jedoch kann ich die Grafik mit einem normalen HTML Editor erst bearbeiten, wenn ich sie in der Zelle als Hintergrund definiere.
    Jedoch möchte ich auch eine Hintergrundfarbe haben, die meine Seite umschließt. Wenn ich jedoch diese im Body-Tag definiere, dann überdeckt sie das Hintergrundbild der Zelle.
    Wie kann ich dieses Problem lösen?

    Phunny
  • Sorry bin grade etwas in Eile und verstehe dich nicht so ganz.
    Also willst du jetzt
    -zb einen orangenen Hintergrund haben
    -in der Mitte des Bildschirms befindet sich das Bild
    -und auf dem Bild drauf befindet sich der text?

    Ich antworte heute abend.


    mfg. h4wX
  • Also ich weiß momentan nicht wie man das machen sollte, mit der Schrift auf deinem Bild.
    Ansonsten könnte es so aussehen:
    d78.de/images/1210355135sample1.JPG

    Hier ist der Code den ich benutzt habe:

    <html>
    <head><title> Phunsoldiers Seite </title>
    </head>
    <body style="background-color: #0000ff;">
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <div align="center">
    <img src="http://www6.picfront.org/picture/p8qXahuGajp/img/Kontakt.jpg" width="350"
    height="350" border="1" />
    </body>
    </html>
    .
    Evtl. könntest du ja dein Bild mit deinem Hintergrund schon vorher in PS bearbeiten. Ansonsten weiß ich auch nicht weiter.


    mfg. h4wX
  • Dann mach das Bild doch als

    Quellcode

    1. background-image('bild.jpg');

    Also in deinem Falle wäre es praktisch ein container-Div zu machen, wo erst der Header und die Links sind und danach ein Text-Div ala

    Quellcode

    1. <div style="background-image:url('bild.jpg');width:XXpx;height:XXpx;">Text</div>


    Gruß
    Broken Sword
  • Auf den rot markierten Bereich?

    Das müsste so gehen (ohne Gewähr):

    PHP-Quellcode

    1. <html>
    2. <head><title> Phunsoldiers Seite </title>
    3. <style type="text/css">
    4. .div {
    5. background-image: url('deinbild.gif');
    6. border-top: 3px solid #CC0000;
    7. border-bottom: 3px solid #CC0000;
    8. border-left: 3px solid #CC0000;
    9. border-right: 3px solid #CC0000;
    10. }
    11. img {
    12. border: none;
    13. }
    14. </style>
    15. </head>
    16. <body style="background-color: #0000ff;">
    17. <img src="header.jpg" alt="Kontakt" title="Kontakt" /><br />
    18. <!-- Nachfolgendes formatiere ich mal mit einer Tabelle, da ich divs nicht so gut kann ;) -->
    19. <table border="0" cellspacing="2" cellpadding="2">
    20. <tr>
    21. <td><img src="startseite.jpg" alt="Startseite" title="Zur Startseite" /></td>
    22. <td><img src="kontakt.jpg" alt="Kontakt" title="Kontakt" /></td>
    23. <td><img src="impressum.jpg" alt="Impressum" title="Zum Impressum" /></td>
    24. </tr>
    25. </table>
    26. <div class="div">Hier könnte dein Text stehen...</div>
    27. </body>
    28. </html>
    Alles anzeigen


    Hoffe das hilft dir ;)

    mfg
    Snip3r

    //EDIT: Broken war mal wieder schneller :(

    //EDIT2: kleine CSS Korrektur ;)
    Neulinge * Forenregeln * F.A.Q. * Lexikon
    Suchfunktion* IRC * Teamspeak * User helfen User
    Patrioten reden nur davon, dass sie für ihr Land sterben, niemals davon, dass sie für ihr Land töten. (Bertrand Russell)