Порядок выполнения лабораторной работы:
Создайте собственную страницу (проверяя её вид в окне браузера на каждом этапе проектирования):
Запустите программу "Блокнот" (notepad.exe). Создайте файл с именем и расширением <Ваша фамилия>.html.
В этом файле напечатайте текст HTML-страницы (в ней обязательно должен присутствовать заголовок и комментарий). HTML-страница должна отображать в окне браузера какую-нибудь строку. Например:
<html>
<head> Это мой сайт!!!!
<title>Моя первая страничка </title>
</head>
<body>
Здравствуйте, это я и моя первая страница. Давайте знакомиться!
<br>
Добро пожаловать! :)
</body>
</html>
Допишите текст страницы так, чтобы получилось два абзаца произвольной тематики. При этом первый абзац должен быть выровнен по центру, а второй - по левому краю. Шрифт первого абзаца должен быть "bold" (жирный), "underline" (подчёркнутый) и на размер больше второго, а шрифт второго абзаца – "italic" (курсив). Задайте разные шрифты для абзацев.
Пример:
<html>
<head> Это мой сайт!!!
<title>Моя первая страничка </title>
</head>
<body text="#336699" bgcolor="#000000">
<center>
Здравствуйте, это я и моя первая страница. Давайте знакомиться!
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </center>
<p align="center">
<b> <u> <font size="+2" face="ARIAL">
Я совсем недавно начал(а) знакомиться с HTML, и мне сразу же тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появться еще один виртуальный друг? :)</b></u></font> </p>
<p align="left">
<i><font size="+1" face="Algerian">Мои увлечения просты! но в двух словах не расскажешь, потому давайте перейдем к следующей страничке</i></font></p>
</body>
</html>
Добавьте в Web-документ после второго абзаца гиперссылку на сайт хнэу (http://www.Hneu.Edu.Ua/ua/news.Html).
Примечание: Тэг <a></a> делает ссылкой заключенную в него картинку или фразу (текст). Принципы прописывания пути здесь такие:
(1) - <a href="prf.html">мои фотографии</a>
(2) - <a href="photos/prf.html">мои фотографии</a>
(3) - <a href="http://www.homepage.ru/prf.html">мои фотографии</a>
В случае (1) документ лежит в той же директории (папке), что и документ, в котором мы ссылаемся на prf.html, в случае (2) документ лежит в поддиректории /photos, в случае (3) мы ссылаемся на сайт http://www.homepage.ru, где лежит нужный нам документ.
Есть один фактор, который нам нужно учесть: цвет ссылки нужно прописывать, а иначе по умолчанию он будет просто безобразным, поэтому вспомним об открывающем тэге боди:
<body text="#336699" bgcolor="#000000" link="#339999" alink="#339999" vlink="#339999">
Измените вид странички следующим образом:
Задайте отличные от установленных по умолчанию цвета: текста, фона и гиперссылок. Задайте отступ для строки от верхнего и левого края окна браузера. Сделайте так, чтобы цвет второго абзаца был отличен от первого.
Вставьте между абзацами картинку и обведите её рамкой с толщиной более 1 пиксела. Установите текст второго абзаца справа от картинки на определённом расстоянии.
Добавьте после абзаца с картинкой и до гиперссылки красную нерельефную линию шириной в 2 пиксела и длиной 80% от ширины окна браузера, выровняв её по середине странички.
Просмотрите свою страницу (если это возможно) в двух различных браузерах.