We
Study
Together
cat

baner


Макет на три колонки (окончание)

Конечно трехколончаную конструкцию можно написать гораздо проще. Я сознательно не сделал этого - путь ОТ СЛОЖНОГО К ПРОСТОМУ гораздо легче пройти самостоятельно. :)

Как вариант, могу посоветовать такой HTML код:

<body>
<div id="header">Шапка</div>
<div id="wrapper_left">
<div id="menu">
<ul>
<li><a href="#.html">ссылка 1</a></li>
<li><a href="#.html">ссылка 2</a></li>
<li><a href="#.html">ссылка 3</a></li>
<li><a href="#.html">ссылка 4</a></li>
</ul>
Здесь можно поместить анонсы новостей или рекламу
</div>
<div id=container>
<div id="content">
<h3>Задача </h3>
<p> Создать "резиновый" макет на три колонки с "шапкой" и "подвалом". Область основного содержимого в центре, колонка "menu" - слева. Справой стороны страницы помещаем блок новостей "news".</p>
</div>
<div id="right">
<h2>news</h2>
<ul>
<li>news 1</li>
<li>news 2</li>
<li>news 3</li>
</ul>
</div>
</div>
</div>
<div id="footer">©   </div>
</body>

Правила для стилей пишем сами, не забываем протестировать то что получилось. Добавляем информацию в блок "menu", проверяем не рассыпалась ли конструкция. То же самое проделываем с "content" и "right".

Вспоминаем о том способах подключения стилей к Web-странице и выбираем самый оптимальный - внешний стилевой файл.

Напомнинаю, правила стилей пишем в Блокноте и сохраняем под именем "style.css", или любым другим, не забывая при этом добавить к имени точку и расширение css. Так как описание стилей располагается в отдельном файле, то между тегами <head>...</head>, каждого HTML документа сайта, добавляем ссылку на файл таблицы связанных стилей: <link rel="stylesheet" type="text/css" href="ваше_имя.css">


У меня получилось, пробуйте.




на следующую страницу  
CSS
  
Hosted by uCoz