Kolyan, точняк ошибся с чёрным!
vl25, вот попробуй самая простая и красивая главная страница:
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ru" xml:lang="ru">
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1251" />
<meta name="description" content="Блочная вёрстка." />
<meta name="keywords" content="Сайт, вёрстка, блоки, блочная вёрстка." />
<title>Главная страница</title>
<style>
/*Общие параметры страницы*/
* {
margin: 0;
padding: 0;
border: 0;
}
body {
padding: 2% 0 0;
background: #ccff00;/*цвет фона*/
color: #333;
font-family: “Comic Sans MS”, Verdana, Arial, Helvetica, sans-serif;
}
/*шапка*/
#header {
background-image: url(http://www.imghost.in/images/jgxup01l7ug9bnbj1j.png);
width: 760px;/*ширина шапки*/
height: 196px;/*высота шапки*/
}
#container {
width: 760px;/*ширина блока*/
margin: 0 auto;
}
#text { /*стиль для блока с текстом*/
width: 545px;
font-size: .8em;
color: #333;
margin: 10px auto;
float: left;
border : 1px solid #999;
}
#text p {
text-align: justify;
text-indent: 1.5em;
margin: 0;
padding: 0 15px;
}
#text a {
color: #396;
}
#text a:hover {
color: #f36;
border-bottom: #f36 dotted 1px;
}
#members {
width: 300px;
height: 190px;
float: right;
}
#members h2 {
color: #f60;
font-size: 120%;
font-weight: bold;
text-align: center;
}
#members ol {
color: #999;
font-size: 120%;
margin: 10px;
float: left;
}
#members li {
margin: 0 5px;
}
#members li a {
color: #0c0;
}
#members li a:hover {
color: #f00;
}
.line {
width: 304px;
height: 13px;
float: right;
}
#news { /*блок с новостями*/
background: #ffc;
width: 185px;
color: #665;
margin: 10px 5px;
float: left;
}
#news h3 { color: #f60;
font-size: 120%;
font-weight: bold;
text-align: center;
}
#news ul {
list-style: url(marker.jpg) inside;
}
#news li {
font-size: 75%;
padding: 5px 10px;
}
#footer { /*стиль для подвала*/
background : #665;
color : #fff;
font-size : 70%;
padding : 5px;
clear : both;
}
#footer a {
color : #ff0;
}
#footer a:hover {
color : #f00;
}
#footer p {
padding : 2px;
text-align : center;
}
.clearfloat {
clear : both;
}
</style>
</head>
<body>
<div id="container"><!--div блок для общих параметров-->
<div id="header"><!--div блок для шапки-->
</div>
<div id="text"><!--div блок для текста-->
Блок где будет написан текст!<br>
Блок где будет написан текст!<br>
Блок где будет написан текст!<br>
Блок где будет написан текст!<br>
Блок где будет написан текст!<br>
Блок где будет написан текст!<br>
Блок где будет написан текст!<br>
Блок где будет написан текст!<br>
Блок где будет написан текст!<br>
Блок где будет написан текст! И информация<br>
</div>
</div>
<div id="news">
<h3>новости:</h3>
<ul>
<li>Жара в столичном регионе пошла на убыль. В среду днем в Москве воздух прогреется до «плюс» 32-34 градусов, по области — до 31-36 градусов тепла, сообщили в Росгидромете.
<p>«В регионе ожидается переменная облачность, локальные небольшие кратковременные дожди, местами грозы.Температура ночью в Москве «плюс» 19-21 градуса, по области до16-21 градусов тепла; днем в мегаполисе «плюс» 32-34 градуса, по области — 29-34 градуса выше нуля. Ветер восточный 2-7 метров в секунду при грозе с порывами до 15 метров в секунду, сообщает ИТАР-ТАСС.</li>
</ul>
</div>
<div class="clearfloat"></div>
<div id="footer">
<p>Главная | <a href="#">О нас</a> | <a href="#">Реклама</a></p>
<p>© new.RU, 2010 | All right reserved. | <a href="http://validator.w3.org/check?uri=http://www.dizweb.ru/pig/index.html">XHTML</a> | <a href="http://jigsaw.w3.org/css-validator/validator?uri=http://www.dizweb.ru/pig/style.css">CSS</a></p>
</div>
</div>
</body>
</html>
должно получиться как на скрине: