[CSS] Wie eine Grafik in HTML anpassen

Dieses Thema im Forum "Webdesign" wurde erstellt von 0815 ELiTE, 21. März 2009 .

Schlagworte:
  1. 21. März 2009
    Zuletzt von einem Moderator bearbeitet: 15. April 2017
    Wie eine Grafik in HTML anpassen

    Guten Abend RR'ler,

    ich versuche derzeit in ein Design ein neues "Content-Feld" (wenn man dies so nennen kann/darf) zu intregrieren, da ich aber keine großen erfahrungen mit CSS habe bekomme ich es einfach nicht hin.

    Ich möchte dieses Bild:
    lastnews.jpg
    {img-src: //saved.im/otkwntc3cdfp_vs/lastnews.jpg}

    So einbinden, dass es sich in der höhe und der breite dem Text anpasst, welcher in der mitte der Grafik stehen soll. Ich habe mir überlegt das Bild in 9 teile aufzuteilen. Somit das man einaml die ecken, die mitte und die Ränder einzeln hat.
    Jetzt geht es aber ans anpassen und da scheitere ich. Ich weiß überhaupt nicht wie ich ansetzen soll um es zu lösen.

    Ich würde mich über hilfe von euch freuen.
    Vielen Dank im voraus.

    Gruß und schönen abend noch.
    0815 ELiTE
     
  2. 21. März 2009
    AW: Wie eine Grafik in HTML anpassen

    da unten ja noch ein grauer strich ist, würd ich das mit 2 elementen mit background machen..
    das obere, wo der text drin is und sich die grafik in x richtung wiederholt und unten die farbe des bildes hat..
    und das andere unten dran mit dem grauen strich
     
  3. 21. März 2009
    AW: Wie eine Grafik in HTML anpassen

    Vielen Dank für die schnelle Hilfe, daran hatte ich auch schonmal gedacht, aber direkt wieder verwerfen müssen, da das Bild ja so einen abgerundeten Rahmen hat und dieser muss erhalten bleiben, da es sonst einfach nicht so gut aussieht....

    Löst man das ganze am besten mit <div>'s oder wie sollte ich es machen?
     
  4. 22. März 2009
    AW: Wie eine Grafik in HTML anpassen

    yo mit divs ist es denke ich mal am einfachsten
     
  5. 22. März 2009
    AW: Wie eine Grafik in HTML anpassen

    Wie erazor schon gesagt hat, am besten arbeitest du hier mit <div>'s.

    Die Eigenschaften, die du brauchst sind background-image und background-repeat (vermutlich hier repeat-x).

    Informationen zu CSS findest du auf CSS4YOU

    nicht umbedingt am einfachsten (mit tables geht is imho einfacher), aber auf jedenfall coding-technisch schöner/besser =]
     
  6. 28. März 2009
    AW: Wie eine Grafik in HTML anpassen

    Vielen Dnak für eure Hilfen, habt alle eine BW dafür bekommen

    Aber leider habe ich es noch immer nicht hinbekommen

    Hab das Bild nun in 9 Elemente aufgeteilt, aber bekomme es nun nicht korrekt in CSS umgestezt das sich die "Content-Box" erstmal so aussieht wie sie aussehen soll und sich dann noch an der höhe und der breite automatisch anpasst.

    Hier die 9 Bilder:
    Bild
    Bild
    Bild
    Bild
    Bild
    Bild
    Bild
    Bild
    Bild

    Vielen Dank nochmal für eure Hilfe
     
  7. 29. März 2009
    AW: Wie eine Grafik in HTML anpassen

    Und was sollen wir jetzt machen? Zeig uns doch mal wie es schlussendlich aussehen soll...
    Haust noch ein float mit rein und setzt die verschiedenen divs nebeneinander und fertig...

    Wenn du dich in css eingelesen hast (was nicht sonderlich schwer ist) sollte das eigentlich ruckizucki fertisch sein^^

    EDIT: Ah okay, sehe grad so wie im 1. Post solls aussehen...aber was mir auffällt: Um das ganze nach unten hin (also von der höhe) felxibell zu gestalten kannst du das so (also von deinem Ausgangsbild) im prinzip vergessen da du in der seite ne unregelmäßigkeit drin hast...
     
  8. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.