sich an Text anpassendes Bild

Hallo,

leider konnte ich zu diesem Thema nichts finden.
Was ich mir vorstelle ist ein Hintergrundbild, das innerhalb des Contents eingefügt wird und sich bei längeren Texten anpasst.
Auf den ersten Blick könnte man meinen, das wäre die normale Hintergrundgrafik des Contents, aber was ich suche ist etwas komplizierter.

Beispielsweise wie hier:

http://www.bap.de/start/aktuell/logbuch/mittwoch-2-juli-2014-mittwoch-16-juli-2014-k%C3%B6lnbonn
http://www.bap.de/start/aktuell/logbuch/samstag-03-mai-2014-bis-samstag-31-mai-2014-k%C3%B6ln-%C3%A7irali-t%C3%BCrkei-hamburg

Wenn man sich die beiden Seiten ansieht, fällt auf, dass offensichtlich jeweils der obere und untere Teil der Hintergrundgrafik (Papier) bestehen bleiben und sich der Zwischenteil längenmäßig anpasst.

Besteht die Möglichkeit etwas in der Art auch im Design Clean umzusetzen?

Noch besser fände ich eine Lösung, bei der die gewünschte Grafik nicht den kompletten Content ausfüllen würde, sondern lediglich eine Art Textfeld bilden würde.
Ähnlich wie beispielsweise jenes in dem ich gerade schreibe.

Theoretisch könnte ich natürlich auch für jede meiner Seiten ein eigenes Hintergrundbild erstellen, aber bei Textänderungen wären diese ja wieder hinfällig. Hinzu käme noch der erhebliche benötigte Speicherplatz für die unzähligen Grafiken.

Vielen Dank schonmal,

Christoph

PS.: Es geht um diese Homepage:

http://chrisp-music.de.tl/CHRISP.htm
______________

Ein solcher sich anpassender Hintergrund besteht immer aus drei Bilder:

Eines oben und eines unten, welche den Rahmen bilden, in diesem Fall hier sind diese in einer einzelnen Datei gespeichert:
http://www.bap.de/start/sites/all/themes/bap1/img/bg-content/bg-generic-top-bottom-4-emb.jpg

Der mittlere Bereich ist eine sich wiederhohlende Grafik, welche oben und unten nahtlos gestaltet ist, sodass es keine harten Kanten gibt, wenn man die Grafik mehrfach übereinander anzeigt. Das ist bei der von dir genannten Seite diese:
http://www.bap.de/start/sites/all/themes/bap1/img/bg-content/bg-aktuell-middle-4-emb.jpg

Im Code benötigst du also ebenfalls drei Bereiche, denen du diese Bilder als Hintergrundgrafik zuweist. Falls du :before und :after nutzt, genügt sogar ein einzelnes HTML-Element und du kannst das Oben und Unten wie einen Rahmen in CSS festlegen.

Eine Funktion, um Bilder nathlos zu machen, bietet beispielsweise GIMP (bei den Filtern). Diese Funktion macht jedoch alle vier Seiten nathlos.
______________
- Signatur vom Mod Team angepasst -
Bitte keine Werbung für fremde Projekte

=> Das ist sehr schade. Ich habe mich hier im Forum über viele Jahre engagiert und einfach meine Signatur zu verändern zeugt von mangelnder Wertschätzung für meine Beiträge, die einzig den Nutzern des Homepage-Baukastens zugute kamen. Spätestens mit der Reduzierug auf max. 10 Unterseiten* sind die guten Zeiten des Baukastens ohnehin vorbei und die einst große Gremeinschaft im Forum hat sich längst aufgelöst. Nun bin ich hier offenbar auch nicht länger erwünscht. Bleibt mir nur lebewohl zu sagen, es waren schöne 14 Jahre und der Baukasten hat mir immer viel Spass gemacht - machts gut und eventuell trifft man sich ja doch nochmal an anderer Stelle im Internet. (07.06.2020)
* mittlerweile sogar nur noch 5

Vielen Dank für die Erklärung!

Aber wie füge ich denn nun die Bilder in meinen Code ein?
Ich bin leider nicht gerade ein HTML-Experte und weiß nicht recht was ich mit ":before und :after" anfangen soll..

Ich könnte jetzt natürlich einfach je drei Grafiken in das Textfeld einfügen, aber wie schreibe ich dann darauf?


EDIT:

Ich habe jetzt folgenden Code gefunden, mit dem man einen Text auf ein Bild schreiben kann:

Allerdings bräuchte ich jetzt noch einen Hinweis, wie ich statt einem Hintergrundbild die genannten drei Bilder einfüge.

Provisorisch nutze ich jetzt dreimal den gleichen Code hintereinander mit je einer anderen Bildadresse.
Das Problem hierbei ist jedoch, dass die Bilder nicht nahtlos ineinander übergehen, sondern es kleine Lücken gibt.

-> siehe hier unten auf der Seite: http://chrisp-music.de.tl/Test.htm
______________

dir dürfte aber schon klar sein, dass du die drei Bilder (Grafiken) nicht einfach so von dieser BAP-Seite "klauen" kannst und für deine HP benutzen kannst - COPYRIGHT

könnte teuer werden
da sollte man lieber selbst kreativ werden und sich was ausdenken, gibt ja noch jede Menge andere Möglichkeiten
______________
MfG aus Klein Paris-vereinzelte Rechtschreibfehler sind Special Effects meiner Tastatur

Ersetze einfach jedes background-color durch background-image und gebe an, ob sich das Bild wiederholen soll oder nicht, siehe: http://de.selfhtml.org/css/eigenschaften/hintergrund.htm

Wenn das das auf jeder Seite der Homepage haben willst, kannst du den style Abschnitt auch bei Text über dem Design einfügen, anstatt auf jeder Seite. Wenn du den dynamischen Hintergrund für den normalen Inhaltsbereich deiner Homepage verwenden willst dann kannst du edit_content_container anstatt dynamischerHintergrund im style Abschnitt angeben.
______________
- Signatur vom Mod Team angepasst -
Bitte keine Werbung für fremde Projekte

=> Das ist sehr schade. Ich habe mich hier im Forum über viele Jahre engagiert und einfach meine Signatur zu verändern zeugt von mangelnder Wertschätzung für meine Beiträge, die einzig den Nutzern des Homepage-Baukastens zugute kamen. Spätestens mit der Reduzierug auf max. 10 Unterseiten* sind die guten Zeiten des Baukastens ohnehin vorbei und die einst große Gremeinschaft im Forum hat sich längst aufgelöst. Nun bin ich hier offenbar auch nicht länger erwünscht. Bleibt mir nur lebewohl zu sagen, es waren schöne 14 Jahre und der Baukasten hat mir immer viel Spass gemacht - machts gut und eventuell trifft man sich ja doch nochmal an anderer Stelle im Internet. (07.06.2020)
* mittlerweile sogar nur noch 5

@klein-paris:

Keine Sorge, die BAP-Seite diente lediglich als Beispiel für die Bilder im Hintergrund; mir ging es nur ums Prinzip.
Auf Bilderklau kann ich gut verzichten.

@freefunstuff:

Vielen herzlichen Dank!
Der Code war genau das, was ich brauchte.

Danke nochmal

Christoph
______________