Верстка страниц блоками
Учебную страницу которую я Вам хочу предложить сделать будет написана на языке xhtml, который более требователен к разработчику, потому что содержит более жесткие стандарты. Так, тэги в html могут писаться в любом регистре, а в xhtml - только в нижнем. Также в xhtml обязательны слеши (косая черта в конце тегов), например <br /> - <hr /> и т.д.
На примере одной простой странички попробую объяснить принцип верстки блоками. Я правда и сам до конца еще не разобрался во всех премудростях этого дела, но вместе надеюсь нам это удастся.
На основе вот такого простого кода мы с Вами сделаем страничку
<!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" xml:lang="ru" lang="ru">
<head>
<title>История Византии</title>
<meta name="description" content="Рассказы об истории древнего мира - Византия" />
<meta name="keywords" content="Византия Константинополь" />
<meta name="author" content="Kon Green" />
<meta name="robots" content="all" />
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<style type="text/css">
стили
</style>
</head>
<body>
<div id="container">
<div id="header"><h1>Заголовок страницы</h1></div>
<div id="menu"><h2>Меню</h2></div>
<div id="content"><h3>Заголовок контента</h3></div>
<div id="sub-section"><h4>Заголовок суб-контента</h4></div>
<div id="footer"><h5>Подвал</h5></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" xml:lang="ru" lang="ru">
<head>
<title>История Византии</title>
<meta name="description" content="Рассказы об истории древнего мира - Византия" />
<meta name="keywords" content="Византия Константинополь" />
<meta name="author" content="Kon Green" />
<meta name="robots" content="all" />
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<style type="text/css">
Сюда будем вставлять стили
</style>
</head>
<body>
<div id="container">
<div id="header">
<h1><span class="c1">История Константинополя (Византия)</span></h1>
</div>
<div id="menu">
<h2>Меню</h2>
<ul>
<li><a href="index.html" title="Византия">Византия</a></li>
<li><a href="index.html" title="Константинополь">Константинополь</a></li>
<li><a href="index.html" title="Земледелие">Земледелие</a></li>
<li><a href="index.html" title="Литература">Литература</a></li>
<li><a href="index.html" title="Крестоносцы">Крестоносцы</a></li>
<li><a href="index.html" title="Османские турки">Османские турки</a></li>
<li><a href="index.html" title="Крушение">Крушение</a></li>
</ul>
</div>
<div id="content">
<h3>Византийская империя</h3>
<p>
Во времена правления императора Юстиниана в 527—565 годах для Констанинополя наступает «золотой век». Через пять лет его правления в 532 году в городе вспыхнуло крупнейшее восстание «Ника» — город был существенно разрушен, собор Святой Софии сгорел. После жестокого подавления бунта Юстиниан заново отстраивает столицу, привлекая лучших архитекторов своего времени. Строятся новые здания, храмы и дворцы, центральные улицы нового города украшаются колоннадами. Особое место занимает строительство собора Святой Софии, который стал самым большим храмом в христианском мире и оставался таковым на протяжении более чем тысячи лет — вплоть до постройки Собора Святого Петра в Риме. Город быстро растёт и становится сначала деловым центром тогдашнего мира, а вскоре и самым большим городом мира. Город даже стали называть просто Город. В период с 666 года по 870 год город подвергается неоднократным осадам со стороны арабов. Во времена правления императора Льва Исавра в 717—741 годах город приходит в упадок, уничтожаются многие фрески и мозаики. Начинается период иконоборчества, который продлится до середины IX века. Второй величайший расцвет Византии, а с ней и Константинополя, начинается в IX веке с приходом к власти Македонской династии (856-1071). Тогда, одновременно с крупными военными победами над основными врагами - болгарами (Василий II даже носил прозвище Болгаробойца) и арабами, расцветает грекоязычная культура: наука (реформируется Константинопольская высшая школа - своего рода первый европейский университет, основанный ещё Феодосием II в 425 году), живопись (в основном фрески и иконы), литература (в основном агиография и летописание). Усиливается миссионерская деятельность, преимущественно среди славян, примером чему служит деятельность Кирилла и Мефодия. В результате разногласий между папой римским и патриархом Константинополя, в 1054 г., произошло разделение христианской церкви, а Константинополь стал православным центром.
</p>
<p>
Так как империя была уже далеко не такой большой, как во времена Юстиниана или Ираклия, в ней не было других городов сопоставимых с Константинополем. В это время, Константинополь играл основополагающее значение во всех областях жизни Византии. С 1071 года, когда началось нашествие турок-сельджуков (предков осман), империя, а с ней и Город вновь погружаются во мрак. Во времена правления династии Комнинов (1081—1185) Константинополь снова переживает последний расцвет - правда, уже не такой, как при Юстиниане и Македонской династии. Центр города смещается на запад к городским стенам, в нынешние районы Фатих и Зейрек. Строятся новые церкви и новый императорский дворец (Влахернский дворец).
</p>
</div>
<div id="sub-section">
<h4>Войны</h4>
<p>
В XI и XII столетиях генуэзцы и венецианцы берут в руки торговую гегемонию и располагаются на Галате. 13 апреля 1204 года Константинополь захватывается рыцарями Четвертого крестового похода, которые его сжигают и практически полностью разоряют. Город становится столицей Латинской империи крестоносцев, в котором экономическое господство перешло к венецианцам. В июле 1261 византийцы, поддержанные генуэзцами, отвоёвывают город, и власть вновь переходит к византийской династии Палеологов.
</p>
<strong>Крушение</strong>
<p>
До середины XIV века Константинополь оставался крупным торговым центром, затем постепенно пришёл в запустение, ключевые позиции в городе захватили венецианцы и генуэзцы. С конца XIV века Константинополь не раз пытались овладеть османские турки. После строительства султаном Мехмедом Завоевателем в 1452 году Румельской крепости судьба города была решена и 29 мая 1453 года после длительной осады город пал.
</p>
</div>
<div id="footer">
<p>
2008 Design by Kon Green
</p>
</div>
</div>
</body>
</html>
<div id="container"> - блок в котором находятся остальные блоки (контейнер)
<div id="header"> - блок для логотипа или заголовка страницы (верх)
<div id="menu"> - блок в котором у нас будет меню сайта (слева)
<div id="content"> - блок в котором будет находиться основной текст (центр)
<div id="sub-section"> - блок в котором будет находиться дополнительный текст (справа)
<div id="footer"> - блок в котором будет находиться копирайт, банеры, счетчики (низ)
На следующей странице мы оформим нашу страничку стилями
