PHP

Декорации

Осталось навесить на готовый движок оформление. Возьмем уже сделанный шаблон, отряхнем от пыли и немножко подправим. Вынесем всю таблицу стилей в отдельный файл с расширением .css, для этого скопируем все стили в блокнот и сохраним как style1.css в ту же самую папку 'www', где лежит index.php. Содержимое файла style1.css такое:

body{background:#fffff0;}

#top{height:80px;
background:#5c0900;
font:48pt courier,serif;
color:#fff;
text-align:center;}

.pm{height:30px;
width:120px;
margin:0 0px 0 0px;
background:#5c0900;
text-decoration:none;
text-align:center;
color:#fff;}

.pm:hover{text-decoration:none;
background:#ff0;
color:#5c0900;}

.pm{float:left}

.pi{float:left;
margin:5px 20px 5px 0px;
height:80px;
width:160px;
background:#eee;
text-align:left;
font:8pt courier,serif;}

#hm{float:right}

#tbl{display:block;
position:absolute;
top:140px;
left:5px;
width:20%;}

#out{float:right;
width:65%;
margin:0 20px 0 20px;
padding:0 0 0 40px;
height:500px;
border:1px solid #aaa;}

#bottom{clear:both;
height:100px;
border:1px solid #aaa;}

Все, что осталось после удаления стилей:

<?php
$hid=$_GET['hid'];
$vid=$_GET['vid'];
if(!$hid)$hid=0;
if(!$vid)$vid=0;
$book=file_get_contents('eugen_onegin.txt');
$chapter=explode("#",$book);

$i=0;
while($i<count($chapter)):
$page[$i]=explode("|",$chapter[$i]);
$i++;
endwhile;
$out=nl2br($page[$hid][$vid]);
?>
<HTML>
<head>
<link rel='stylesheet' type='text/css' href='style1.css' />
<head>
<body>
<div id=box>
<div id=top>Заголовок
</div>
<div id=hm><a href=index.php?hid=0 class=pm>Часть 1</a><a href=index.php?hid=1 class=pm>Часть 2</a><a href=index.php?hid=2 class=pm>Часть 3</a><a href=index.php?hid=3 class=pm>Часть 4</a>
</div>
<div id=out><?echo $out?>
</div>
<div id=tbl>
<div class=pi>Search&nbsp;<form><input type=text size=12>&nbsp;&nbsp;<input type=image src=go_r.ico width=16 height=12></form></div>
<div class=pi><a href=index.php?vid=0&hid=<?echo $hid?> class=pm>Страница 1</a><BR><BR></div><div class=pi><a href=index.php?vid=1&hid=<?echo $hid?> class=pm>Страница 2</a></div><div class=pi><a href=index.php?vid=2&hid=<?echo $hid?> class=pm>Страница 3</a></div>
</div>
</div>
<div id=bottom>
</div>
</body>
</HTML>

Обратим внимание на строку в голове:

<link rel='stylesheet' type='text/css' href='style1.css' />

- этой строкой к файлу index.php подключается теперь уже внешняя таблица стилей. Соберем и запустим. Картинка при запуске должна быть такой. Пощелкаем по ссылкам, посмотрим на работу сайта и его внешний вид в разных обозревателях. А после этого перейдем ко всякой всячине , которая нужна для полноценной работы сайта.

Рейтинг@Mail.ru