nano-nano site.
minimalistic 3kb website
(zip: incl svg, html & css files)
HTML Code.
<html>
<head>
<title>html nano-site</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width; initial-scale=1.0;">
<meta name="description" content="your infos">
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<a href="/">
<img class="l" src="l.svg" title="Im a theta">
</a>
</header>
<main>
<h1>demo html nano site.</h1>
<p>includes logo, html and css files<br> size 2.5kb.</p>
<button> <a href="html-nano.zip">download zip</a></button>
</main>
<footer>
<a href="/">home</a> <a href="ip.htm">imprint & privacy</a>
<div class="g">© your copyright</div>
</footer>
</body>
</html>CSS Code.
/* GLOBAL STYLES */
a:link,a:visited,a:active {
color: black;
text-decoration: none;
padding:0 2px;
}
a:hover {
color: #0D5EAF;
text-decoration: underline
}
h1 {
margin-bottom:-26px;
font-size:3rem;
}
.g {
color:gray;
font-size:1rem;
}
/* CONTENT AREA */
body {
padding:0% 5%;
text-align:center;
font-size:1.6rem;
}
main {
min-height:50vh;
}
/* LOGO */
.l {
padding:6%;
width:150px
}
/* FOOTER */
footer {
font-size:1rem;
}
/* DESKTOP */
@media (min-width: 768px) {
body {
padding:0 20%;
}
}