img. beschriften??

[Sandman]

Hi @ ALl

Also ich habe einen div:

<div id="bild">

indem habe ich ein bild:

<img src="bild.jpg" alt="bild">
</div>

jetzt will ich auf dieses bild etwas draufschreiben
(um genau zu sein will ich es als navigation für meine page nehmen aber es soll halt was draufstehen zum beispiel "home" oder "kontakt")

Wie kann ich das machen??
Wenn ich was unter das div schreib oder in das div und vor das div ist die schrift jeweils unter, oder vor dem bild und nicht AUF ihm.

Hoffe ihr konntet verstehen wie ich das mein.

Grüße

Sandman

P.S. habe schon gegoogelt und so aber nur lösungen mit hilfe einer tabelle gefunden. Das will ich aber nicht :-( will es mit div's

 

[wolf360]

also dein Bild soll praktisch das Hintergrundbild deiner Navi sein?

du könntest ganz einfach das komplette Div als bild verwenden und dann das den Text reinstelln:

<div id="bild" style="background-image: url(bild.gif);">
hier der text
</div>

 

[Sandman]

nee es soll mehr so eine art button werden.

zum beispiel sowas:

http://www.ulf-theis.de/images/tutorials/photoshop/tut_glass_button_step_07.jpg

Nur mit schrift drauf

 

[wolf360]

also in die mitte vom den grünen Punkt soll der Text?

dann klappt meine Methode,
musst halt dann nur noch den horizontale und vertikale Ausrichtung auf center bzw middle stelln.

ansosnt gäbs noch die Möglichkeit, ein weiters div zu erstelln mit position:absolute (damit kann man divs übereinander schieben), das müsstest du abba den Text auf dein Bild anpassn.

ansonst wüsst ich nix

gruß wolf360

 

[Sandman]

ok danke ich werde es mal versuchen

 

[gefaehrder]

du kannst sogar mit dem :hover-effekt (css) das hintergrund-bild so verschieben, dass ohne nachladen der button animiert wirkt.
Mouseover-Buttons und -Effekte mit CSS
CSS 2: schnelle Rollover-Menüs ohne Preload <- da gibts eine kleine erklärung. (:hover kombiniert mit background-position)

 

[wolf360]

hier habs mal mit deinem Bild gemacht und kappt alles ganz gut:

<div id="bild" align="center"   style="background-image: url(bild.jpg); height:400px; width:300px; line-height: 24; vertical-align: middle;">
 hier der text
</div>

 

[kratzbaum]

Mit PHP läßt sich ein Text in eine Grafik hineinschreiben.
Schau dir die Funktion "imagecopy" oder "imagecreatefrompng "an. Dazu brauchst du noch "imagestring" für den Text, "imagecolorallocate" für die Textfarbe usw.
Habe es schon ausprobiert. Wichtig ist die Aktivierung der GD-Library in
der PHP.INI-Datei.