{"id":54,"date":"2025-09-08T22:21:27","date_gmt":"2025-09-08T20:21:27","guid":{"rendered":"https:\/\/hintzonline.de\/?page_id=54"},"modified":"2025-09-11T17:03:01","modified_gmt":"2025-09-11T15:03:01","slug":"hintergrundbild-positionieren","status":"publish","type":"page","link":"https:\/\/hintzonline.de\/?page_id=54","title":{"rendered":"Hintergrundbild positionieren"},"content":{"rendered":"<p>Hintergrundbilder auf Webseiten erm\u00f6glichen weit mehr als beispielsweise ein vollfl\u00e4chiges Kachelmuster.<br \/>\nSo lassen sich auch kleine Grafiken an festgelegten Punkten des Browsers positionieren, etwa rechts unten oder links oben.<br \/>\nDank CSS spielt dabei die Gr\u00f6\u00dfe des Browserfensters keine Rolle.<\/p>\n<p>Im folgenden Beispiel positionieren Sie die Grafik &#8222;logo.gif&#8220;, die sich im Verzeichnis &#8222;images&#8220; befindet, unten zentriert im Browserfenster, die Hintergrundfarbe der Webseite ist Gelb:<\/p>\n<p><span style=\"color: #3366ff;\">&lt;body style=&#8220;background-Image: url(images\/logo.gif);background-color:yellow;<\/span><br \/>\n<span style=\"color: #3366ff;\">background-repeat:no-repeat; background-position:bottom center&#8220;&gt;<\/span><\/p>\n<p>F\u00fcr &#8222;background-position&#8220; stehen Ihnen folgende Optionen zur Verf\u00fcgung:<\/p>\n<p>top = vertikal oben b\u00fcndig<br \/>\nmiddle = vertikal mittig<br \/>\nbottom = vertikal unten b\u00fcndig<br \/>\ncenter = horizontal Zentriert<br \/>\nleft = horizontal linksb\u00fcndig<br \/>\nright = horizontal rechtsb\u00fcndig<\/p>\n<p>Als Farbe k\u00f6nnen auch Hex-Werte angegeben werden.<\/p>\n<div  class='avia-button-wrap avia-button-center  avia-builder-el-0  avia-builder-el-no-sibling ' ><a href='https:\/\/hintzonline.de\/?page_id=26'  class='avia-button  avia-color-theme-color   avia-icon_select-yes-left-icon avia-size-small avia-position-center '   ><span class='avia_button_icon avia_button_icon_left ' aria-hidden='true' data-av_icon='\ue830' data-av_iconfont='entypo-fontello'><\/span><span class='avia_iconbox_title' >Zur\u00fcck<\/span><\/a><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Hintergrundbilder auf Webseiten erm\u00f6glichen weit mehr als beispielsweise ein vollfl\u00e4chiges Kachelmuster. So lassen sich auch kleine Grafiken an festgelegten Punkten des Browsers positionieren, etwa rechts unten oder links oben. Dank CSS spielt dabei die Gr\u00f6\u00dfe des Browserfensters keine Rolle. Im folgenden Beispiel positionieren Sie die Grafik &#8222;logo.gif&#8220;, die sich im Verzeichnis &#8222;images&#8220; befindet, unten zentriert [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-54","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/hintzonline.de\/index.php?rest_route=\/wp\/v2\/pages\/54","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hintzonline.de\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hintzonline.de\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hintzonline.de\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hintzonline.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=54"}],"version-history":[{"count":5,"href":"https:\/\/hintzonline.de\/index.php?rest_route=\/wp\/v2\/pages\/54\/revisions"}],"predecessor-version":[{"id":281,"href":"https:\/\/hintzonline.de\/index.php?rest_route=\/wp\/v2\/pages\/54\/revisions\/281"}],"wp:attachment":[{"href":"https:\/\/hintzonline.de\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=54"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}