<!DOCTYPE html>>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="nav.css">
<script src="https://use.fontawesome.com/d07a8c2f55.js"></script>
<link rel="preconnect" href="https://fonts.gstatic.com">
<title>Html websities</title>
</head>
<body>
<header>
<h1>Cities</h1>
</header>
<section>
<nav>
<ul>
<li>london</li>
<li>paris</li>
<li>toyko</li>
</ul>
</nav>
<article>
<p>London is the capital city of England. It is the most populous city in the United Kingdom, with a
metropolitan area of over 13 million inhabitants.</p>
<p>Standing on the River Thames, London has been a major settlement for two millennia, its history going
back to its founding by the Romans, who named it Londinium</p>
</article>
</section>
<footer>footer</footer>
</body>
</html>
CSS STYLESHEET CODE
*{
box-sizing: border-box;
}
body{
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
header{
background-color: #666;
padding:10px;
text-align: center;
font-size: 35px;
color: #fff;
}
nav{
float: left;
width: 30%;
padding:20px;
height:300px;
background-color: #ccc;
}
section{
clear: both;
content: "";
display: table;
}
article{
float: left;
width:70%;
padding:20px;
height:300px;
background-color: #f1f1f1;
}
footer{
background-color: gray;
padding: 10px;
text-align: center;
}
No comments:
Post a Comment