Suche im Forum:
Suchen


Autor Nachricht
Beitrag19.02.2011 um 11:46 (UTC)    
Titel: Mit HTML-Code auf Bild schreiben

Hallo und einen schönen Samstagmittag,

weiß jemand von euch, wie man mit HTML oder vielleicht auch anders, auf ein Bild schreiben kann.

Ich habe das schon des Öfteren gesehen und finde das eine tolle Idee,

danke im Vorraus,

Max
______________

Beitrag19.02.2011 um 12:17 (UTC)    
Titel:

Eventuell kannst du ein Div Bereich mit Hintergrund erstellen und dort dann
deinen Text reinschreiben. Ich denke mal, du kannst HTML und werde
deshalb keinen konkreten Code posten.
Beitrag19.02.2011 um 18:06 (UTC)    
Titel:

web-cube hat Folgendes geschrieben:
Eventuell kannst du ein Div Bereich mit Hintergrund erstellen und dort dann
deinen Text reinschreiben. Ich denke mal, du kannst HTML und werde
deshalb keinen konkreten Code posten.


Danke erstmal, aber ein DIV-Code selber machen, kann ich nicht, da bräuchte ich schon Hilfe Wink

Gruß,
Max
______________

Beitrag19.02.2011 um 18:12 (UTC)    
Titel:

Achso, wusste ich nicht^^ Das hier sollte gehen:

Code:
<div style="background-image:url(BILDURL); height:XXpx; width:XXpx; padding:XXpx;">Total cool:</div>


Hier mal eine Vorschau:
http://web-cube.de.tl/Test.htm

ACHTUNG: Breite/Höhe im Code = Breite/Höhe des Bildes - (2 * Padding) Wink
Beitrag19.02.2011 um 18:29 (UTC)    
Titel:

web-cube hat Folgendes geschrieben:
Achso, wusste ich nicht^^ Das hier sollte gehen:

Code:
<div style="background-image:url(BILDURL); height:XXpx; width:XXpx; padding:XXpx;">Total cool:</div>


Hier mal eine Vorschau:
http://web-cube.de.tl/Test.htm

ACHTUNG: Breite/Höhe im Code = Breite/Höhe des Bildes - (2 * Padding) Wink


Ok, danke, eine Frage:

Positioniere ich mit den Positionsangaben das Bild oder den Text auf dem Bild??

Gruß,
Max
______________

Beitrag19.02.2011 um 18:36 (UTC)    
Titel:

Mit dem Padding positionierst du den Text.
Beitrag19.02.2011 um 18:37 (UTC)    
Titel:

web-cube hat Folgendes geschrieben:
Mit dem Padding positionierst du den Text.


Alles klar, danke, das war's dann auch schon,

Thread can be closed ...
______________

Beitrag19.02.2011 um 19:48 (UTC)    
Titel:

Padding alleine macht jedoch den gleichen Wert für alle 4 Seiten.
Wenn das Bild, somit auch das DIV nicht gerade ein Quadrat ist (width=height), dann ist der Tex tnicht in der Mitte.
Um etwas genauer Positionieren zu können, kannst du das Padding ja für alle 4 Seiten festlegen.

Das heißt, entweder unter "padding" 4 Werte eintragen, oder 4 Eigenschaften benutzen, was vielleicht für dich übersichtlicher ist.
Code:
padding-left:10px; padding-right: 10px; padding-top: 15px; padding-bottom:20px;

Variiert man alle Zahlen, kann man den Text innerhalb recht gut positionieren.

Mit den Paddingangaben wird jedoch das Div dadurch mitvergrößert. Denn die Höhe und Breite beschreibt den verfügbaren Bereich für Content, ohne den Innenabstand.


Du könntest es auch leicht abgewandelt versuchen:
Code:
<div style="background-image:url(BILDURL); height:200px; width:100px;">
<p style="margin-left: 10px; margin-right: 10px; margin-bottom: 20px; margin-top:15px;">
Hier Dein Text
</p>
</div>


width und height bekommen die Werte des Bildes, wie oben auch (hier Höhe 200 und Breite 100 angegeben).
Die Marginangaben Positionieren nun den Text, ohne Einfluss auf das Div.
______________
Mit freundlichen Grüßen,
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de