Mam problem z css i chyba też html .
Mianowicie zamiast bannera mam takie przedstawienie strony.
Mianowicie chciałbym zamiast tego przedstawienia dać moje logo.
Jestem początkującym WebMasterem . Z góry dzięki.
CSS:
Kod
body {
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size:11px;
padding:0;
margin:0 auto;
color:#737373;
background-color:#FFFFFF;
}
.main{
width:600px;
margin:0px auto;
text-align:left;
}
#header{
height:135px;
width:600px;
background-image:url(images/top.gif);
background-repeat:repeat-x;
background-position:top;
}
#menu_nav {
padding:14px 0px 14px 0px;
margin:30px 0 0px 0;
width:600px;
clear:both;
}
#left{
position:relative;
min-height:300px;
float:left;
margin-bottom:10px;
}
#right{
position:relative;
min-height:300px;
float:left;
margin-bottom:10px;
}
#footer{
position:relative;
width:600px;
clear:left;
background-image:url(images/bottom.gif);
background-repeat:repeat-x;
background-position:top;
height:100px;
padding:25px 10px 0 0;
text-align:right;
}
.name{
color:#74B739;
background-color:inherit;
font-size:32px;
padding:10px 0 0 25px;
}
.slogan{
padding:0 0 0 100px;
font-style:italic;
font-size:12px;
}
a{
color:#74B739;
background-color:inherit;
}
a:hover{
color:#35830D;
background-color:inherit;
text-decoration:none;
}
#menu_nav a {
color:#ffffff;
background-color:#74B739;
font-weight:bold;
font-size:12px;
text-decoration:none;
padding:7px 23px 7px 22px;
border:1px solid #35830D;
}
#menu_nav a:hover {
color:#ffffff;
background-color:#35830D;
text-decoration:none;
padding:7px 23px 7px 22px;
}
.title1{
border-bottom:3px solid #D1D1D1;
width:385px;
font-size:12px;
font-weight:bold;
color:#737373;
background-color:inherit;
font-style:italic;
margin:0 10px 0 0;
}
.title2{
border-bottom:3px solid #74B739;
width:200px;
font-size:12px;
font-weight:bold;
color:#737373;
background-color:inherit;
font-style:italic;
}
.text1{
border:1px solid #D1D1D1;
width:363px;
margin:3px 10px 0 0;
padding:10px;
}
.text2{
border:1px solid #D1D1D1;
width:178px;
margin:3px 0px 0 0;
padding:10px;
}
.cp{
float:left;
padding-left:10px;
}
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size:11px;
padding:0;
margin:0 auto;
color:#737373;
background-color:#FFFFFF;
}
.main{
width:600px;
margin:0px auto;
text-align:left;
}
#header{
height:135px;
width:600px;
background-image:url(images/top.gif);
background-repeat:repeat-x;
background-position:top;
}
#menu_nav {
padding:14px 0px 14px 0px;
margin:30px 0 0px 0;
width:600px;
clear:both;
}
#left{
position:relative;
min-height:300px;
float:left;
margin-bottom:10px;
}
#right{
position:relative;
min-height:300px;
float:left;
margin-bottom:10px;
}
#footer{
position:relative;
width:600px;
clear:left;
background-image:url(images/bottom.gif);
background-repeat:repeat-x;
background-position:top;
height:100px;
padding:25px 10px 0 0;
text-align:right;
}
.name{
color:#74B739;
background-color:inherit;
font-size:32px;
padding:10px 0 0 25px;
}
.slogan{
padding:0 0 0 100px;
font-style:italic;
font-size:12px;
}
a{
color:#74B739;
background-color:inherit;
}
a:hover{
color:#35830D;
background-color:inherit;
text-decoration:none;
}
#menu_nav a {
color:#ffffff;
background-color:#74B739;
font-weight:bold;
font-size:12px;
text-decoration:none;
padding:7px 23px 7px 22px;
border:1px solid #35830D;
}
#menu_nav a:hover {
color:#ffffff;
background-color:#35830D;
text-decoration:none;
padding:7px 23px 7px 22px;
}
.title1{
border-bottom:3px solid #D1D1D1;
width:385px;
font-size:12px;
font-weight:bold;
color:#737373;
background-color:inherit;
font-style:italic;
margin:0 10px 0 0;
}
.title2{
border-bottom:3px solid #74B739;
width:200px;
font-size:12px;
font-weight:bold;
color:#737373;
background-color:inherit;
font-style:italic;
}
.text1{
border:1px solid #D1D1D1;
width:363px;
margin:3px 10px 0 0;
padding:10px;
}
.text2{
border:1px solid #D1D1D1;
width:178px;
margin:3px 0px 0 0;
padding:10px;
}
.cp{
float:left;
padding-left:10px;
}
HTML:
Kod
HTML:
[html]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<link href="style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="image.css" />
<title>Zespol X</title>
</head>
<body>
<div class="main">
<div id="header"><div class="name">Zamiast tego X</div><div class="slogan">to obrazek</div>
<div id="menu_nav">
<a href="http://www.ittechnology.us/szablony/zycie/" title="Link do strony głównej serwisu">Strona Główna</a>
<a href="http://www.ittechnology.us/szablony/zycie/o-firmie.html" title="Opis firmy">O firmie</a>
<a href="http://www.ittechnology.us/szablony/zycie/uslugi.html" title="Szczegółowy opis usług">Nasze usługi</a>
<a href="http://www.ittechnology.us/szablony/zycie/dojazd.html" title="Opis dojazdu do firmy">Dojazd do nas</a>
<a href="http://www.ittechnology.us/szablony/zycie/kontakt.html" title="Można się z nami skontaktować telefoniczne i mailowo">Kontakt</a>
</div>
</div>
<div id="left"><div class="title1"></div>
<div class="text1">
<!-- Tutaj zaczyna się treć -->
<h2>Nagłówek </h2>
<p>
<img alt="Opis zdjęcia, a w nim ważne dla nas słowa kluczowe" src="images/zdjecie1.jpg" id="rightImg" />
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc venenatis erat
eget dolor. Praesent risus felis, mattis at, ultrices in, laoreet ac, nunc.
Pellentesque semper tempus pede. In hac habitasse platea dictumst. Integer
ipsum tortor, tempus ut, vehicula ac, consequat id, nisl.
<br/>
Aliquam sit amet nunc
ut tellus faucibus sodales. Nulla sed nisi. Fusce consectetuer dignissim leo.
Nullam mollis dui ultricies ipsum. Duis mollis, mi sit amet tincidunt
vestibulum, erat nisi mollis neque, in elementum massa dolor quis dolor.
Suspendisse sem diam, luctus ac, vestibulum interdum, accumsan vel, ligula.
Aliquam erat volutpat. Curabitur sed nisl. </p>
<p></p>
<p>
Maecenas posuere, ipsum at facilisis feugiat, mi orci accumsan sem, eget
fermentum felis massa et pede. Proin vitae nisl id purus congue dictum. Nulla
metus quam, nonummy sed, pretium vitae, vestibulum a, ligula. Praesent
consectetuer. Nunc non odio. Aenean nec mi. Aliquam erat volutpat. Nullam
elementum risus nonummy ipsum. Morbi erat mauris, tincidunt sed, ultricies nec,
gravida ut, arcu. Etiam est. Nullam lacinia, felis vitae vulputate bibendum,
eros ipsum volutpat quam, et luctus felis turpis sit amet velit. Quisque porta,
mauris et vestibulum sollicitudin, neque ante sollicitudin mi, eget convallis
justo purus et est. </p>
<!-- Tutaj kończy się treć -->
</div>
</div>
<div id="right"><div class="title2">Nazwa firmy</div>
<div class="text2">
<ul><li>ul. Krakowska 23/23</li>
<li>01-111 Kraków</li>
<li>tel. 046 22343456</li>
</ul>
</div>
</div>
<div id="footer"><div class="cp">Design by <a href="http://www.freetemplatesonline.com/">Free Templates Online</a></div> | Opracowanie <a href="http://www.ittechnology.us/">Marketing w Internecie</a></div>
</div>
</body>
</html>
[html]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<link href="style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="image.css" />
<title>Zespol X</title>
</head>
<body>
<div class="main">
<div id="header"><div class="name">Zamiast tego X</div><div class="slogan">to obrazek</div>
<div id="menu_nav">
<a href="http://www.ittechnology.us/szablony/zycie/" title="Link do strony głównej serwisu">Strona Główna</a>
<a href="http://www.ittechnology.us/szablony/zycie/o-firmie.html" title="Opis firmy">O firmie</a>
<a href="http://www.ittechnology.us/szablony/zycie/uslugi.html" title="Szczegółowy opis usług">Nasze usługi</a>
<a href="http://www.ittechnology.us/szablony/zycie/dojazd.html" title="Opis dojazdu do firmy">Dojazd do nas</a>
<a href="http://www.ittechnology.us/szablony/zycie/kontakt.html" title="Można się z nami skontaktować telefoniczne i mailowo">Kontakt</a>
</div>
</div>
<div id="left"><div class="title1"></div>
<div class="text1">
<!-- Tutaj zaczyna się treć -->
<h2>Nagłówek </h2>
<p>
<img alt="Opis zdjęcia, a w nim ważne dla nas słowa kluczowe" src="images/zdjecie1.jpg" id="rightImg" />
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc venenatis erat
eget dolor. Praesent risus felis, mattis at, ultrices in, laoreet ac, nunc.
Pellentesque semper tempus pede. In hac habitasse platea dictumst. Integer
ipsum tortor, tempus ut, vehicula ac, consequat id, nisl.
<br/>
Aliquam sit amet nunc
ut tellus faucibus sodales. Nulla sed nisi. Fusce consectetuer dignissim leo.
Nullam mollis dui ultricies ipsum. Duis mollis, mi sit amet tincidunt
vestibulum, erat nisi mollis neque, in elementum massa dolor quis dolor.
Suspendisse sem diam, luctus ac, vestibulum interdum, accumsan vel, ligula.
Aliquam erat volutpat. Curabitur sed nisl. </p>
<p></p>
<p>
Maecenas posuere, ipsum at facilisis feugiat, mi orci accumsan sem, eget
fermentum felis massa et pede. Proin vitae nisl id purus congue dictum. Nulla
metus quam, nonummy sed, pretium vitae, vestibulum a, ligula. Praesent
consectetuer. Nunc non odio. Aenean nec mi. Aliquam erat volutpat. Nullam
elementum risus nonummy ipsum. Morbi erat mauris, tincidunt sed, ultricies nec,
gravida ut, arcu. Etiam est. Nullam lacinia, felis vitae vulputate bibendum,
eros ipsum volutpat quam, et luctus felis turpis sit amet velit. Quisque porta,
mauris et vestibulum sollicitudin, neque ante sollicitudin mi, eget convallis
justo purus et est. </p>
<!-- Tutaj kończy się treć -->
</div>
</div>
<div id="right"><div class="title2">Nazwa firmy</div>
<div class="text2">
<ul><li>ul. Krakowska 23/23</li>
<li>01-111 Kraków</li>
<li>tel. 046 22343456</li>
</ul>
</div>
</div>
<div id="footer"><div class="cp">Design by <a href="http://www.freetemplatesonline.com/">Free Templates Online</a></div> | Opracowanie <a href="http://www.ittechnology.us/">Marketing w Internecie</a></div>
</div>
</body>
</html>
