JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html>
<head>
<title>Подшипник + </title>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
<header>
<nav>
<a href="/index.html"> Главная</a>
<a href="#">Импортные подшипники</a>
<a href="#">Отечественые подшипники</a>
<a href="#">Каталог</a>
<a href="#">Продажа запчастей</a>
<a href="#">Контакты</a>
</nav>
</header>
<section>
</section>
<footer >
<p>© 2013 Подшипник +</p>
</footer>
</body>
</html>
CSS
* {
margin:0 auto;
background:#ced5df;
}
header {position:relative;
width:980px;
height: 179px;
background: #00B0D8 url(img/header.jpg) no-repeat;
}
nav{
display:block;
background:none;
position: absolute;
bottom: -1px;
}
a{
color:black;
text-decoration:none;
padding: 0px 15px 0 15px;
background:none;
}
a:hover{
background:#cbdeef;
}
a:active{
background:#cbdeef;
}
section {
width:980px;
background: -moz-linear-gradient(top left, #ccdff0, #e7e9f4);
background: -webkit-linear-gradient(top left, #ccdff0, #e7e9f4);
background: -o-linear-gradient(top left, #ccdff0, #e7e9f4);
background: -ms-linear-gradient(top left, #ccdff0, #e7e9f4);
background: linear-gradient(top left, #ccdff0, #e7e9f4);
background: linear-gradient(top left,#ccdff0,#e7e9f4);
}
footer {
display: block;
width:980px;
}
p{ background: #322929;
padding:20px 400px;
color:#dd1010;
}