Найти тему

Создаём первый HTML-файл

Для создания HTML-файлов можно воспользоваться каким-нибудь визуальным редактором HTML (например, FrontPage, Dreamweaver или Actual Drawing), профессиональным редактором HTML-тегов (AceHTML или HoTMetaL), можно воспользоваться даже обычным Word’ом. Но для того, чтобы испытать специфику работы над HTML-документом, свой первый файл создайте в простом Блокноте. В Mac и Linux существуют свои аналоги.

Запустите программу: Пуск | Программы | Стандартные | Блокнот (рис. 2.1).

Введите приведённый ниже код:

<html>

<head>

<title>Экономика</title>

</head>

<body>

<p>Перейдя по этой ссылке, вы попадёте в раздел <a href="file2.htm">Экономическая теория.</a>

</p>

</body>

</html>

Сохраните созданный файл под названием file1.htm. Затем откройте его в браузере. В окне браузера этот текст отобразиться следующим образом:

Перейдя по этой ссылке, вы попадёте в раздел «Экономическая теория».

Появившийся здесь новый тег "a" (<a href="file2.htm">Экономическая теория.</a>) называется «якорем» (anchor) и применяется для создания гиперссылок. Тег "a" снабжается атрибутом href (обозначает гипертекстовую ссылку - Hypertext Reference), в параметрах которого указывается целевой файл (в данном случае это – файл file2.htm). Помещённый внутрь этого тега текст становится интерактивным: наведя на него курсор и щёлкнув левой кнопкой мыши, вы сможете открыть в браузере файл, на который сделана ссылка (в данном случае это не существующий пока file2.htm).

Всё, что находится внутри тега <p> </p> отобразилось на экране в виде простого текста, а помещённый внутри тега <a href="file2.htm"> </a> текст отображается синим цветом с подчёркиванием (стандартное отображение гиперссылок), и приобрёл свойство интерактивности (щёлкнув на нём, вы переместитесь на страницу «file2.htm» с названием «Экономическая теория»).

Чтобы проверить правильность всех шагов, создайте файл file2.htm. Откройте ещё одно окно Блокнота и введите в него тот же код, только замените текст в тегах <title> </title> и <a> </a> например, на следующий:

<title>Экономическая теория</title>

<p>Перейдя по этой ссылке, Вы попадёте в раздел <a href="file1.htm">Экономика.</a>.

Открыв один из созданных документов в браузере, вы сможете, «кликая» по ссылкам Экономическая теория. и Экономика. перемещаться из одного документа в другой. Если получается – всё сделано правильно. Если нет – скорее всего, вы допустили ошибку, указав неправильное название файла в теге <a href=" ">.

Эти примеры были даны только затем, чтобы Вы смогли получить наглядное представление о том, как создаётся html-документ. В дальнейшем вам почти не придётся выписывать в ручную все теги: за вас это куда быстрее сделают специальные программы, некоторые из которых были упомянуты выше.

Пройдите курс по ссылке: Веб-технологии. Часть I