Text über Bild

[t3b123]

Hallo miteinander,

Ich bin ein grosser fan der website "GameOne". Ich frag mich nur wie die das mit dem Bild und diesem grauen Balken machen. Der text ist text und nicht im bild eingearbeitet.

ich währe forh, wenn mir jemand helfen könte.

Ich dachte ich habe im Code gesehen es sei ein JavaScript, und ich schreibe es in dieses Forum

hier noch ein screenshot:

http://www.imagesup.de/bild-gamonejpg-103081-GameOne_Titel.htm

 

[Gilles]

Dafür brauchst du nur CSS. Wie es hier gelöst wurde, weiss ich nicht genau, aber eine möglichkeit wäre folgende:

<div id="bildContainer">
  <p id="textContainer">Bli bla Blub</p>
</div>

der passende Style

<style>
            #bildContainer {
                background: url("bild.jpg");
                width: 300px;
                padding-top: 200px;
                height: 100px;
            }
            
            #textContainer {
                
                height: 83px;
                background-color: #000000;
                color: white;
                opacity: 0.5;
            }
            
        </style>

Opacity ist in jedem Browser unterschiedlich. Müsstets du dich mal drin einlesen. Ich habe hier ein 300px x 300 px großes bild genommen :)