3. Установка параметров Web-документа
1)Автоматическое обновление странички (пишется в индексном файлеindxLr09.html):<meta http-equiv=refresh content=15>:http– гипертекстовый протокол передачи данных;meta– обновление. По истечении 15 сек экран должен моргнуть (произойдет автоматическое обновление странички):
<html>
<head>
<title> Построение фреймов </title>
<meta http-equiv=refresh content=15>
<frameset cols = "*, 2* ">
<frame src= "LeftFrame.html" name="f0" >
<frame src= "RightFrame.html" name="f1" >
</frameset>
</head>
<body>
</body>
</html>
2)Дескрипторы оформления:
а)Подчеркивание (дескрипторhr): сделаем на примере файлаpurpose.html. Строка, представленная ниже, пишется перед дескриптором </body>:
Фрагмент кодировки:
<div class=Section1>
<p class=MsoNormal style='text-indent:35.4pt'><b><i>Цель работы:</i></b> </p>
<p class=MsoNormal>Ознакомиться с построением фреймов.</p>
</div>
<hr width=80% align=left>
</body>
</html>
где, width=80%- линия будет длиной 80% от длины окна;align=left– выравнивание влево.
б)Центрирование с маркером, цвет фона и вставка рисунка:
Центрирование:
<p align=center>- по центру
<p align=left>-cлевой стороны
<p align=right>- с правой стороны
Установка маркера:
<li> nbsp;гдеnbsp;- установка пробела
Цвет фона:
<body bgcolor=red> (lime, navy, gray, olive, yellow)
Полужирный шрифт:
<b> …… </b>
Вставка рисунка как фон странички:
Для начала необходимо нужный рисунок вставить в новый пустой документ редактора MS Word (при необходимости можно изменить яркость рисунка, чтобы он был блеклым и в дальнейшем на нем хорошо был виден текст). Далее этот документ необходимо сохранить какWeb-страницу (расширениеhtml). При сохранении, редакторMS Wordпоместит рисунок в отдельную папку (имя папки=имени файла с расширениемhtml). Рисунок будет иметь названиеimege002.gif(или другие цифры).
Далее рисунок необходимо скопировать в каталог, где находится Web-страница (если этого не сделать, то придется задавать полный путь к рисунку), и тогда, для того, чтобы сделать рисунок фономWeb-страницы нужно написать:
<body background = imege002.gif> или
<body background ="Img/image002.gif">
Вставка в Web-страницу рисунка в виде файла:
В Web-страницу можно поместить любой рисунок с расширением*.gifили*.jpg. Эти рисунки или копируются в каталог, где находитсяWeb-страница, или к ним пишется полный путь.
<img src="Img/image001.jpg" width=300 hieght=150 > или
<img src=image001.jpg width=300 hieght=150 >
где, width=300 hieght=150– длина и ширина рисунка в пикселях.
Для того, чтобы в случае не обнаружения рисунка появилось сообщение, необходимо написать следующее:
<img src=image001.jpg width=300 hieght=150 alt= «Рисунок не найден!!!!!» border=1>
3)В файле, отвечающем за цель работы (purpose.html) сделаем следующее:
- название отцентрируем по середине;
- перед названием поставим маркер;
- цвет фона странички сделаем желтым.
Фрагмент кодировки:
<p class=MsoNormal style='text-indent:35.4pt'><b><li><p align=center>Цель работы:</b> </p>
<p class=MsoNormal>Ознакомиться с построением фреймов.</p>
<hr width=80% align=left>
<body bgcolor=yellow>
</div>
</body>
</html>
Все дескрипторы пишутся перед дескриптором </div>.
В результате этого должно получиться следующее (рисунок 1.)
|
|
|
Рисунок 1 – Вид окна браузера |
4)В файле, отвечающем за постановку задачи (post.html) сделаем следующее:
- вставим фоновый рисунок;
- вставим рисунок в виде файла;
- вставим псевдорисунок (чтобы появилось сообщение).
Фрагмент кодировки:
<body background ="Img/image002.gif">
<img src="Img/image004.jpg" width=350 hieght=250 >
<img src=image001.jpg width=200 hieght=100 alt= "Рисунок не найден!!!!!" border=1>
</div>
</body>
</html>
Все дескрипторы пишутся перед дескриптором </div>.
В результате этого должно получиться следующее (рисунок 2.)
|
|
|
Рисунок 2 - Вид окна браузера |
Для того, чтобы просмотреть полученную Web-страницу, необходимо запустить индексный файлindxLr09.html.