Potrzebuję strony w html. teskt wstawię sam musi mieć baner i boczne menu. NIe może to być żaden pobrany szablon bo to nie przejdzie.
Z góry dzięki za pomoc ! : )
" Life is not a problem to be solved but a reality to be experienced! "
© Copyright 2013 - 2024 KUDO.TIPS - All rights reserved.
index.html -> http://pastebin.com/Ni3AKADt
style.css ->http://pastebin.com/GzV79D4B
Zapisz te dwa pliki w jednym foldzerze i strona gotowa :-)
(to samo co wyżej):
index.html:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" />
<meta charset="utf-8" />
<title>Moja strona</title>
</head>
<body>
<div id="main">
<div id="logo">
Tutaj jest fajny napis
</div>
<div id="body">
<div id="menu">
<h3>Menu</h3>
<ul>
<li><a href="#">Strona główna</a></li>
<li><a href="#">Druga strona</a></li>
<li><a href="#">Trzecia strona</a></li>
<li><a href="#">Czwarta</a></li>
</ul>
</div>
<div id="content">
<h3>Zadane.pl...</h3>
<p>Lorem ipsum dolor sit amet...</p>
</div>
<div style="clear:both"> </div>
</div>
</div>
<div id="stopa">
Stopka
</div>
</body>
</html>
style.css:
html, body {
margin: 0;
font-family: Tahoma, Veranda, Arial, sans-serif;
}
body {
background: #a7cfdf;
background: -moz-linear-gradient(top, #a7cfdf 0%, #23538a 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a7cfdf), color-stop(100%, #23538a));
background: -webkit-linear-gradient(top, #a7cfdf 0%, #23538a 100%);
background: -o-linear-gradient(top, #a7cfdf 0%, #23538a 100%);
background: -ms-linear-gradient(top, #a7cfdf 0%, #23538a 100%);
background: linear-gradient(to bottom, #a7cfdf 0%, #23538a 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a7cfdf', endColorstr='#23538a', GradientType=0);
height: 100%;
background-repeat: no-repeat;
background-attachment: fixed;
}
div#main {
width:1000px;
margin:auto;
background:white;
border-left:1px solid #ccc;
border-right:1px solid #ccc;
box-shadow: 0px 0px 5px 5px #ddd;
padding:20px;
}
div#stopa {
width:400px;
margin:auto;
background:white;
padding:5px;
text-align:center;
box-shadow: 0px 7px 3px 5px #ddd;
}
div#logo {
width:100%;
border-bottom:1px solid #ddd;
font-size:54px;
color:white;
text-shadow: 0px 0px 10px #25438f;
filter: dropshadow(color=#25438f, offx=0, offy=0);
}
div#body {
min-height:100px;
}
div#menu {
width:215px;
float:left;
padding-right:15px;
}
div#content {
float:left;
width:760px;
}
div#menu h3 {
margin-bottom:2px;
}
div#menu ul {
list-style-type: none;
margin:0;
padding:0;
padding-left:6px;
}
div#menu ul li {
margin:0;
margin-bottom:3px;
-webkit-transition:all 0.5s;
-ms-transition:all 0.5s;
-o-transition:all 0.5s;
transition:all 0.5s;
padding:2px;
}
div#menu ul li:hover{
margin-left:4px;
color:white;
background:#356aa0;
}
div#menu ul li a {
text-decoration: none;
color:#356aa0;
}
div#menu ul li:hover a {
text-decoration: none;
color:white;
}