HTML/CSS - Auf Bild schreiben?

    Das Bild dort ist in einem DIV-Element, in diesem Element befindet sich das Bild sowie ein weiteres DIV-Element mit dem Text.


    Advertising has us chasing cars and clothes, working jobs we hate so we can buy shit we don’t need.
    – Tyler Durden


    Sobald Werbung im Spiel ist, bist du, die Nutzerin, der Nutzer, das Produkt.


    Zitat von Xtreme.

    Ich würde jetzt die Methode nehmen:
    Du nimmst das Bild und bearbeitest es mit Photoshop und lädst es dann einfach wieder hoch ;)

    Umständlich und SEO-technisch nicht optimal. Hier ein eben schnell per Hand gecodetes Beispiel:


    PHP
    <div style="background-image: url('bg.jpg'); width: 720px; height: 300px; position: relative;">
	<div style="position: absolute; background-image: url('bgtext.png'); width: 50%; bottom: 10%; padding: 5px;">
		<span style="font-size: 2em; color: #ffffff; display: block; padding-left: 10px;">Lorem Ipsum</span>
		<span style="font-size: 1.5em; color: #ffffff; display: block; padding-left: 10px;">dolor sit amet</span>
	</div>
</div>


    Bilder: bgtext.png (1x1 px) und bg.jpg


    Ergebnis:


    Solltest du mal Bilder einpflegen wollen, die nicht exakt die Größe des DIVs haben, so füge ich dir gleich noch ein kleines CSS Snippet hinzu:

    Code
    background: url(bilder/hintergrund.png) no-repeat center center fixed; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;