Jak uzyskac taki efekt co na zdjęciu ? https://www.dropbox.com/s/87evbbrcqhytvl7/strona%20kon.png?dl=0
Planuje dodac kontakt, płatnosci oraz okienko fb :P moze byc w sumie xd Oraz na końcu miejsce na © Pomoże mi ktoś z tym bede wdzięczny
<!DOCTYPE HTML>
<html lang="pl">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>stronawww</title>
<meta name="description" content="Serwery minecraft z jakością" />
<meta name="keywords" content="gry, minecraft, skyblock, minigry, EasyHc" />
<link href="style.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div class="wrapper">
<nav class="nav">
<ol>
<li><a href="#">Sklep SMS</a></li>
<li><a href="#">Forum</a></li>
<li><a href="#">Serwery</a></li>
<li><a href="#">Launcher</a></li>
<li><a href="#">Regulamin</a></li>
</ol>
</nav>
</div>
<div class="content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam mollis, odio ac posuere tempus, nisi orci luctus ipsum, sit amet pharetra ipsum erat ut nulla. Aliquam scelerisque magna a dui volutpat, sit amet condimentum lacus pretium. Quisque viverra odio orci, sit amet aliquet turpis finibus sit amet. Nullam ut hendrerit est. Aenean sed varius nunc, in convallis ipsum. Nunc eget justo vulputate, volutpat nisi at, elementum est. Sed quis rutrum elit. Morbi nec eleifend ante, vitae consequat felis. Etiam interdum nibh at lorem fringilla, sit amet pellentesque ligula lobortis. Fusce commodo, sapien non blandit pretium, libero enim efficitur leo, sed auctor sem ex at metus. In feugiat nisi ut orci tristique malesuada. Maecenas pellentesque sem finibus rutrum aliquam. Maecenas non odio tristique, eleifend ante ut, mattis justo. Proin a sem posuere ex lacinia ornare. Nullam auctor sit amet sapien at vestibulum.</p>
<p>Aenean in metus vulputate mauris finibus venenatis. Duis posuere molestie massa, at ultricies turpis. Mauris rhoncus, mi sit amet mattis maximus, felis metus ultricies lorem, nec pharetra arcu nibh eget erat. Aliquam dictum semper commodo. Fusce aliquet eros est, at interdum nunc finibus eu. Praesent sodales dolor quis dolor ullamcorper, nec vulputate velit lobortis. Duis luctus velit ut congue condimentum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam congue volutpat sodales.</p>
Morbi quis lectus venenatis, dictum libero eget, finibus tellus. Duis nec vestibulum velit, at iaculis nisl. Aenean sed ante finibus, ultricies dolor eget, vestibulum diam. Fusce congue ultricies justo eget rutrum. Praesent quis fringilla justo. Quisque efficitur ligula non elit facilisis, quis sollicitudin nibh mattis. Nam dapibus ligula tincidunt velit varius, sit amet consectetur odio condimentum. Duis vitae libero quam. Sed eu dui vel augue lobortis scelerisque ut semper lacus. Donec sit amet arcu vestibulum, varius quam a, fringilla eros. Mauris at nisl arcu. Proin gravida malesuada augue vitae blandit. Duis elementum est vel mi tempor convallis.</p>
<p>Ut eget nisl odio. Proin non hendrerit magna. Nam sagittis, augue eu maximus lobortis, urna nibh accumsan est, sit amet condimentum augue libero sit amet nibh. Sed sit amet ex sit amet risus accumsan vehicula nec ut odio. Etiam vel dictum dui. Praesent aliquet, diam a interdum faucibus, turpis eros tincidunt est, eu consectetur nibh est a ex. Fusce hendrerit sodales est nec fringilla. Praesent imperdiet ex ante, in finibus odio imperdiet luctus.</p>
</div>
</div>
</div>
</div>
</body>
</html>
CCCCCCCCCCSSSSSSSSSSSSSCCCCCCCCCCCCSSSSSSSSSSS
body
{
color: #ffffff;
background: url('img/tło.jpg');
//background: url('img/obrazekk');
//background-size: 100px 100px;
background-size: cover;
margin: 0 !important;
}
.wrapper
{
width: 100%;
}
.nav
{
line-height: 40px;
width: 100%;
background-color: #ffffff;
text-align: center;
border-top: 1px solid #751b1b;
border-bottom: 1px solid #751b1b;
opacity: 0.3;
}
ol
{
padding: 0px;
margin: 0;
list-style-type: none;
font-size: 18px;
height: 40px;
}
ol a
{
color: #451717;
text-decoration: none;
display: block;
line-height: 40px;
}
ol > li
{
float: left;
width: 150px;
height: 40px;
}
ol > li:hover
{
background-color: #cf6969;
}
.content
{
width: 1000px;
margin-left: auto;
margin-right: auto;
text-align: justify;
padding-top: 10px;
}
