Zitat:
Zitat von Sailor56
Ohne deinen Code zu sehen, wird dir wohl keiner helfen können - am Besten du postest einen Link zu Seite.
Oder falls das nicht geht hier, unter Nutzung der entsprechenden Code- Einfügefunktion, das, was du an Code (HTML und CSS) geschrieben hast.
|
HTML:
Code:
<html>
<head>
<script type = "text/javascript" src = "header.js"> </script>
<link href='https://fonts.googleapis.com/css?family=Chela One' rel='stylesheet'>
<link rel="shortcut icon" href="Logo.ico" />
<title>Aroma Café Troisdorf</title>
<meta charset = "utf-8">
<style type="text/css">a {text-decoration: none}</style>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href = "style.css" rel = "stylesheet" type = "text/css">
</head>
<body>
<div id="wrapper">
<div id = "banner">
<img src="Logo.jpg" id="logo1" class="box" alt="Logo des Aroma Cafes Troisdorf Spich"/>
<!--<ul id="navibereich" class="box">
<li id="navi01">
<a href="index.html">
<img src="ButtonImg.png" width="100px" />
</a>
</li>
<li id="navi02">
<a href="galerie.html">
<img src="ButtonImg.png" width="100px"/>
</a>
</li>
<li id="navi03">
<a href="ereignisse.html">
<img src="ButtonImg.png" width="100px"/>
</a>
</li>
</ul>-->
<div id="navigation">
<div class="nav">
<a href="ereignisse.html">
<img src="ButtonImg.png" width="200px"/>
</a>
</div>
<div class="nav">
<a href="ereignisse.html">
<img src="ButtonImg.png" width="200px"/>
</a>
</div>
<div class="nav">
<a href="ereignisse.html">
<img src="ButtonImg.png" width="200px"/>
</a>
</div>
</div>
</div>
</div>
</body>
</html>
CSS:
Code:
body{
background-image: url(logo.ico);
background-size: 70% auto;
background-attachment: fixed;
background-repeat: no-repeat;
background-position: 0px 250px;
}
#wrapper{
position: relative;
height: 100vh;
width: 98vw;
}
#banner{
height: 250px;
width: 100%;
background-color: rgba(120, 120, 120, 0.2);
overflow: visible;
}
.box{
float: left;
}
div.nav{
display: inline-block;
width: 200px%;
height: auto;
float: left;
max-height: 100%;
position: relative;
bottom: 15px;
padding: 60px;
}
#navigation{
bottom: 0px;
}
.nav a:hover{
background-color: rgba(120, 120, 120, 0.4);
}
/*#navibereich li {
bottom: 0px;
width: 100px;
position: relative;
display: inline; /* Listenelemente nebeneinander
list-style-type: none; /* Aufzählungszeichen entfernen
padding: 100px 0;
/*border-left: 1px solid #14ede5;
margin: 0;
}
#navibereich img{
bottom: 0px;
}
#navibereich a{
text-decoration: none; /* Unterstreichung entfernen
}
#navibereich a:hover,
#startseite #navi01 a, /* mit Komma am Ende
#galerie #navi02 a,
#ereignisse #navi03 a{
background-color: #00BFFF;
background-image: url(farbverlauf.jpg);/* Hintergrundgrafik einfügen
background-repeat: repeat-x; /* von links nach rechts wiederholen
background-position: top left; /* oben links beginnen
} { /* ohne Komma am Ende
background-color: #EDEDF8;
}*/
#Timeline{
display: block;
float: right;
height: 20%;
width: 20%;
top: 300px;
}
#Timeline h2{
height: -100px;
}
#Artikel1Img{
/*border: 10px;
border-color: #FFFFFF;*/
display: block;
margin-bottom: 15px;
margin-top: -15px;
margin-left: auto;
margin-right: auto;
}
#Artikel1{
/*border: 1px solid #83c2f7;*/
/*border-bottom: 1px solid #a4a4a4;*/
background-color: #fffff;
border-width: 0px 0px 1px 0px;
margin-top: -15px;
}
#Artikel1 h3{
color: black;
font-family: Akkurat, sans-serif;
text-align: center;
}
#info-box {
background-color: #fffff;
position: absolute;
right: 0;
top: 30%;
top: 30%;
width: 25%;
}
#logo1{
max-height: 100%;
max-width: 100%;
}
Tut mir leid das iel unnötiges Zeug dabei ist, was ich teils gar nicht mehr brauche. Ich bin nur gerade sehr am experimentieren und später will ich das ganze dann noch schön machen