basti1012.bplaced.net

Hallo an die CSS Experten, Folgende Situation: Im body habe ich ein Hintergrundbild, welches den ganzen Bildschirm durch Erscheinen soll. Im article soll nun dieses Hintergrundbild allerdings nur mit, sagen wir hier als Beispiel: 10% erscheinen. Wie immer führen viele Wege nach Rom und ich habe da eine Idee, aber die ist so richtig kompliziert. Mein Gefühl sagt mir, dass das mit parent/child in CSS machbar sein sollte. Dies ist allerdings ein Bereich, der bei CSS und mein Wissen noch eher zu den weißen Flecken gehört. Dazu habe ich zwar Beispiele gegoogelt, aber dort bin ich nicht so richtig weiter gekommen. Danke für einfache Codierungsansätze, gerne auch links.

Code

                                    
                                <style>
  body {
    margin: 0;
    padding: 0;
    background-image: url(/image/images.jpg);
}


header { 
  width:100%;
  height:100px;
  border:5px solid black;
  box-shadow:5px 10px 10px white;
  text-align:center;
  font-size:50px;
    background:rgba(255,255,255,0.1);
}

article{ 
  margin-top:150px;
  width:100%;
  height:100px;
  border:5px solid black;
  text-align:center;
  font-size:50px;
    background:rgba(255,255,255,.7);
   box-shadow:-5px -10px 10px white;
}


</style>
<header>Header</header>
<article>Hier steht nee mnge text drinne</article>