I just started my Website with an Background Picture that Looks like a wall beeing stamped from behind with my logo. Everything works good and the Picture gets smaller when I make the Browser smaller and vice versa. Will say you always see the full Background Picture. But now I want to realize the Navigation with signs pinted on the wall. One is for "About us" one for "Impressum" and so on. The Problem now is that everytime I Change the browser size (like written before) the signs do not keep on place an also the do not Change their size. Has anyone an idea how to get out of thie Trouble. I do not know if CSS is all I Need or do I also need any Divs or Selections (working with HTML5). Michael
<!DOCTYPE HTML>
<html>
<head>
<title>Keep at it</title>
<!-- <sonderzeichen ermöglichen -->
<meta charset="UTF-8" />
<meta name="keywords" content="Keep at it, Individuelle Programmierung, MongoDB,The beast behind my beauty">
<!--<link rel="stylesheet" href="..\CSS\Background.css" type="text/css" media="screen"/> </link>-->
<Style type="text/css" media="screen">
img.bg {
/* Set rules to fill background */
min-height: 100%;
min-width: 1024px;
/* Set up proportionate scaling */
width: 100%;
height: 100%;
/* Set up positioning */
position: fixed;
top: 0px;
left: 0;
}
@media screen and (max-width: 1024px){
img.bg {
left: 50%;
margin-left: -512px; }
}
img.sc {
/* Set up proportionate scaling */
width: 15%;
height: 15%;
/* Set up positioning */
position: relativ;
top: 50px;
left: 50px;
z-index: 10;
}
</Style>
</head>
<body>
<img src="../Bilder/Coming soon2.jpg" class="bg" alt="Background">
<img src="../Bilder/Schild.jpg" class="sc">
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire