• Start
• Tipps und Tutorials
• Der Weg zur erfolgreichen Homepage
• Write Area
• Intro Button entfernen
• Formular Buttons gestalten
• Werbebanner zentrieren
• Designwechsel
• Textarea
• Hover Effekt
• Text Effekte
• Firefox 4 Problem
• CSS Code bereinigen
• Zufalls Bildergalerie
• Newsletter Extra verschieben
• Video Tutorials
• Counter verschieben
• Werbelayer deaktivieren
• Trennlinie anpassen
• Nach oben Link
• Facebook Button
• Impressumspflicht
• Google Plus Button
• Bildergalerie mit Lightbox
• Bilder im Gaestebuch
• Nach oben scrollen
• Social Media
• Banner erstellen
• Content Boxen
• Bild mit Text umfliessen
• Zeilenabstand vergroessern
• Aufklappbare Texte
• Design zentrieren
• Baukasten Werbelink anpassen
• Youtube Videos einfuegen
• Slideshow
• Slideshow mit CSS
• DESIGNCENTER
• USER DESIGNS
• HpBk Design Collection
• 2012
• Tour
• Unser Star fuer den HpBk
• Sommer Award
• CD 2013
• Menu3
• Grundwissen
• Landkarte2
• alte headline
• Smiley Center neu
• Adressen
• USER DESIGN VORLAGE 2013
• Thickboxen
• Neue Lightbox
• NEUE DESIGN UEBERSICHT
• sidebar weg
• Lightbox fuer Designuebersicht
• Neue Business
• Lightbox 2
• Teaser Highlight
• Blickpunkt Baukasten 2
• Startseite 2014
• Blickpunkt Baukasten 1
• Mein Forum
• bsp backup
• Design Center
• UEBER 2014
• CSS 2014
• UNTER 2014
• Blickpunkt Baukasten
• Extras
• Aprilscherz
• Startseite 2015
• News links
• Titel der neuen Seitewe
• Graue Box - Ganze Breite
• Titel der neuen Seite24243
• Hilfe Center
• Titel der neuen Seite
• Loaditup Fehler
• Titel der neuen Seite334654

Bild mit Text umfliessen

Am besten beginnen könnt ihr, wenn ihr bereits einen Text habt, der mit einem Bild aufgehübscht werden soll. Dazu begebt ihr euch in den Seiteneditor unter "Eigene Seiten editieren". Als nächstes fügt ihr also ein Bild ein. Dies macht ihr über den Button "Bild einfügen". Das Bild wurde nun im Editor eingefügt. Klickt jetzt auf das kleine Symbol "Bild einfügen/editieren". Es öffnet sich ein Fenster, in dem wir folgende Einstellungen vornehmen: In diesem Beispiel wird das Bild links vom Text platziert (Ausrichtung). Natürlich könnt ihr es auch rechts platzieren.



Nun klicken wir auf "Erweitert" und geben unter "Style" folgenden Befehl ein:
margin-right: 20px; Solltet ihr euer Bild rechts platzieren wollen, müsst ihr hier folgenden Code eingeben:
margin-left: 20px;
Die 20 Pixel könnt ihr natürlich beliebig anpassen. Je größer die Zahl, desto größer wird der Abstand vom Text zum Bild.



Klickt nun auf "OK" und übernehmt eure Einstellungen.



Das Bild wird nun also links im Editor platziert und der Text verläuft mit einer sauberen Kante zum Bild mit einem Abstand von 20 Pixeln.

---

Kommentar zu dieser Seite hinzufügen:

Dein Name:
Deine E-Mail-Adresse:
Deine Homepage:
Deine Nachricht:

hpbk-templateworld