tobiwldfoto.de

by tobiwldfoto

HTML

<!DOCTYPE html>
<html lang="de" id="index">

<head id="head">
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link href="./css/index.css" rel="stylesheet">
	<link href="./pictures/favicon.ico" rel="shortcut icon">
	<title>Home - tobiwldfoto</title>
</head>

<body id="body">
	<div id="navbar">
		<a href="#">Home</a>
		<a href="./html/gallery.html">Galerie</a>
		<a href="./html/equipment.html">Equipment</a>
		<a href="https://tobiwldfoto.blogspot.com/" target="_blank">Blog</a>
		<a href="./html/contact.html">Kontakt</a>
	</div>
	
	<div id="header">
		<p id="heading">Herzlich Willkommen!</p>
		<p id="subheading">auf meiner Website</p>
	</div>

	<div class="footer">
		<a href="https://www.instagram.com/tobi.wld.foto" target="_blank"><img src="./pictures/instagram.ico" height="15px"/></a>
		<a href="./html/impressum.html" target="_blank">Impressum</a>
		<a href="./html/datenschutz.html" target="_blank">Datenschutz</a>
		<a href="https://www.twitter.com/tobi_wld_foto" target="_blank"><img src="./pictures/twitter.ico" height="15px"/></a>
	</div>
</body>

<footer>

</footer>

</html>

CSS

/*Ganze Seite*/
* {
	background-image: url(../pictures/background.webp);
	background-size: cover;
	background-attachment: fixed;
}

/*Body*/
#body {
	font-family: 'Quicksand', 'Courier New';
	margin: 1px;
	padding: 1px;
}

/*Navigation Bar*/
#navbar {
	overflow: hidden;
	width: 540px;
	margin: 0px auto;
}
  
#navbar a {
	float: left;
	color: rgb(0, 0, 0);
	padding: 10px 25px;
	text-decoration: none;
}

#navbar a:hover {
	color: rgb(255, 255, 255);
	font-weight: bold;
	text-decoration: underline;
}

/*Überschrift*/
#heading {
	text-align: center;
	font-size: 40px;
	color: rgb(22, 65, 125);
	font-weight: bold;
}

/*Unterüberschrift*/
#subheading {
	text-align: center;
	font-size: 23px;
	color: rgb(0, 0, 0);
}

/*Footer*/
.footer {
	position: fixed;
	bottom: 0px;
	overflow: hidden;
	width: 415px;
	margin: 0px auto;
}
  
.footer a {
	float: left;
	color: rgb(255, 255, 255);
	padding: 10px 25px;
	text-decoration: none;
}

.footer a:hover {
	color: rgb(0, 0, 0);
	font-weight: bold;
	text-decoration: underline;
}