![]() Главная страница Случайная страница КАТЕГОРИИ: АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника |
I. Основы языка HTMLСтр 1 из 5Следующая ⇒
ВВЕДЕНИЕ В ТЕХНОЛОГИЮ СОЗДАНИЯ WEB-САЙТОВ ОБРАЗОВАТЕЛЬНОГО НАЗНАЧЕНИЯ НА ЯЗЫКЕ HTML I. Основы языка HTML
Цель обучения: научиться создавать файлы, содержащие элементы форматирования на языке HTML. Требуемый начальный уровень подготовки слушателей: уметь работать с основными объектами Windows, знать возможности, принципы и основные приемы работы с компьютером. Задание: создать простую web-страничку на языке html. Теоретические аспекты: Веб-сайт - это группа страниц, логически связанных друг с другом общей идеей или темой, написанных на языке HTML и имеющих общее дизайнерское решение. HTML (HyperText Markup Language) - это язык, принятый в World Wide Web для создания и публикации web-страниц. HTML предоставляет авторам средства для: – включения в web-документы заголовков, текста, таблиц, списков, фотографий и т.п.; – перехода к другим web-страницам посредством щелчка кнопки мыши по гипертекстовой ссылке; – создания и заполнения форм для транзакций с удаленными службами, например, для поиска информации, бронирования билетов, оформления заказов на товары и т.п. – непосредственного включения в web-документы видеоклипов, звука и других внешних объектов. Язык HTML используется для задания логической структуры документа (заголовки, абзацы, графические изображения и прочие объекты). Термин HTML (HyperText Markup Language) означает «язык маркировки гипертекстов». Первую версию HTML разработал сотрудник Европейской лаборатории физики элементарных частиц Тим Бернерс-Ли. Язык НТМL позволяет размечать электронный документ, который отображается на экране с полиграфическим уровнем оформления; результирующий документ может содержать самые разнообразные метки, иллюстрации, аудио- и видеофрагменты и так далее. В состав языка вошли развитые средства для создания различных уровней заголовков, шрифтовых выделений, различные списки, таблицы и многое другое. Важным моментом, повлиявшим на судьбу HTML, стало то, что в качестве основы был выбран обычный текстовый файл. Выбор был сделан под влиянием следующих факторов: – такой файл можно создать в любом текстовом редакторе на любой аппаратной платформе в среде какой угодно операционной системы; – к моменту разработки HTML существовал американский стандарт для разработки сетевых информационных систем — Z39.50, в котором в качестве единицы хранения указывался простой текстовый файл в кодировке LATIN1, что соответствует US ASCII. Таким образом, гипертекстовая база данных в концепции WWW — это набор текстовых файлов, размеченных на языке HTML, который определяет форму представления информации (разметка) и структуру связей между этими файлами и другими информационными ресурсами (гипертекстовые ссылки). Гипертекстовые ссылки, устанавливающие связи между текстовыми документами, постепенно стали объединять самые различные информационные ресурсы, в том числе звук и видео; в результате возникло новое понятие — гипермедиа. Для освоения HTML могут понадобиться две вещи: – Любой браузер, т.е., программа, пригодная для просмотра HTML-файлов. – Любой редактор текстовых файлов. Вполне подойдет Блокнот (Notepad). Web-страничка создается в Блокноте и сохраняется с расширением.htm. Вот самый простой HTML-документ: < html> < head> < title> Лабораторная работа < /title> < /head> < body> < H1> Привет! < /H1> < P> Это простейший пример HTML-документа. < /P> < P> Этот html-файл может быть одновременно открыт и в блокноте, и в браузере. Сохранив изменения в блокноте, просто нажмите кнопку Reload ('перезагрузить') в браузере, чтобы увидеть эти изменения. < /P> < /body> < /html>Для удобства чтения в примере введены дополнительные отступы, однако в HTML это совсем не обязательно. Более того, браузеры просто игнорируют символы конца строки и множественные пробелы в HTML-файлах. Поэтому пример мог бы выглядеть вот так: < html> < head> < title> Лабораторная 2. Пример 1.< /title> < /head> < body> < H1> Привет! < /H1> < P> Это простейший пример HTML-документа.< /P> < P> Этот html-файл может быть одновременно открыт и в блокноте, и в Internet Explorer'е. Сохранив изменения в блокноте, просто нажмите кнопку Reload ('перезагрузить') в Explorer'е, чтобы увидеть эти изменения.< /P> < /body> < /html>Как видно из примера, вся информация о форматировании документа сосредоточена в его фрагментах, заключенных между знаками " < " и " > ". Такой фрагмент (например, < html>) называется тегом (по-английски — tag). Итак, тег HTML состоит из следующих друг за другом в определенном порядке элементов: – левой угловой скобки < – необязательного слэша /, который означает, что тег является конечным тегом, закрывающим некоторую структуру. Таким образом, в этом контексте вы можете читать символ /, как конец. Практически все теги являются парными, т.е. открывающему тегу соответствует закрывающий, который пишется с чертой (/) после открывающей скобки. – имени тега, например TITLE или PRE – необязательных, если даже тег может иметь их, атрибутов, задающих различные свойства тега, дающих дополнительную информацию о том, как браузер должен обработать текущий тег. Тег может быть без атрибутов или сопровождаться одним или несколькими атрибутами, например: ALIGN=CENTER – правой угловой скобки >. Примеры: < H1> < H1 ALIGN=LEFT> Как было сказано, большинство, но не все теги HTML спарены так, что за открывающим тегом следует соответствующий закрывающий тег, а между ними содержится текст или другие теги, например: < H1> Заголовок< /H1> В таких случаях два тега и часть документа, отделенная ими, образуют блок, называемый HTML элементом. Теги можно вводить как большими, так и маленькими буквами. Например, метки < body>, < BODY> и < Body> будут восприняты браузером одинаково. Для каждого тега определяется множество возможных атрибутов. Большинство тегов допускает один или несколько атрибутов, однако атрибутов может и совсем не быть. Спецификация атрибутасостоит из расположенных в следующем порядке: – имени атрибута, например WIDTH – знак равенства (=) – значения атрибута, которое задается строкой символов, например, " 80". Всегда полезно заключить значение атрибута в кавычки, используя либо одинарные ('80'), либо двойные кавычки (" 80").
Практические задания:
|