Hey Leute,
ich bin neu hier im Forum, weil ich beim schreiben einer Website einfach nicht mehr weiter weiß :-(
Neben dem oben genannten Thema hab ich noch einige Fragen, bei denen Ihr mir hoffentlich weiterhelfen könnt.
1. Wie verteile ich die Navigationsleiste horizontal gleichmäßig?
2. Wenn ich das Fenster verkleinere, verschiebt sich alles. Woran könnte das liegen?
3. Könnt ihr mir Tipps geben, wie die Website moderner und frischer aussieht? Die Website soll eine Person
repräsentieren. Sie soll aktuelle Beiträge enthalten (Beruf ist Journalist) und man soll sich mit der Person in
Verbindung setzen können.
LG Hacker28
ich bin neu hier im Forum, weil ich beim schreiben einer Website einfach nicht mehr weiter weiß :-(
Neben dem oben genannten Thema hab ich noch einige Fragen, bei denen Ihr mir hoffentlich weiterhelfen könnt.
1. Wie verteile ich die Navigationsleiste horizontal gleichmäßig?
2. Wenn ich das Fenster verkleinere, verschiebt sich alles. Woran könnte das liegen?
3. Könnt ihr mir Tipps geben, wie die Website moderner und frischer aussieht? Die Website soll eine Person
repräsentieren. Sie soll aktuelle Beiträge enthalten (Beruf ist Journalist) und man soll sich mit der Person in
Verbindung setzen können.
LG Hacker28
HTML:
<html>
<head>
<title></title>
<meta name="author" content="---">
<link rel="stylesheet" href="format.css" type="text/css">
</head>
<body>
<div id="logo">
<h1>Sportjournalismus XXXXXX</h1>
<h3><i>Slogan</i></h3>
<hr color="#FFFFFF">
</div>
<div id="navigation">
<ul id="navi">
<li><a href="#">START</a></li>
<li>|</li>
<li><a href="#">AKTUELLE BEITRÄGE</a></li>
<li>|</li>
<li><a href="#">STECKBRIEF</a></li>
<li>|</li>
<li><a href="#">KONTAKT</a></li>
<li>|</li>
<li><a href="#">IMPRESSUM</a></li>
</ul>
<hr color="#FFFFFF">
</div>
<div id="haupt">
<p>testing</p>
</div>
</body>
</html>
Code:
body {
margin-left: 15%;
margin-right: 15%;
margin-top: 5%;
margin-bottom: 5%;
height: 100%;
font-family: Courier New, Courier, Verdana;
background: -moz-linear-gradient(bottom,#2F0000,#DF0000); /* Firefox */
background: -webkit-gradient(linear,left top,left bottom,from(#2F0000),to(#DF0000)); /* Chrome, Safari */
filter: progid:DXImageTransform.Microsoft.gradient(start Colorstr='#2F0000',endColorstr='#DF0000'); /* Internet Explorer */
background-repeat: no-repeat;
background-attachment: fixed;
}
#logo {
height: 15%;
text-align: center;
color: #FFFFFF;
}
h1 {
font-size: 250%;
font-weight: bold;
}
#navigation {
background-color: ;
height: 5%;
margin: 0;
padding: 0;
text-align: justify;
color: #FFFFFF;
font-size: 120%;
}
#navigation ul {
margin: 2%;
padding: 0;
}
#navigation li {
list-style: none;
margin: 0;
padding: 0;
}
#navi li {
display: inline;
list-style-type: none;
margin: 0;
padding: 4px 0;
}
#navigation a {
text-decoration: none;
font-weight: bold;
color: #FFFFFF;
}
#navigation a:hover {
color: #BFBFBF;
}
#haupt {
background-color: #009090;
height: 80%;
}
Zuletzt bearbeitet: