Файл: Основы программирования на языке HTML (Изучение предметной области).pdf

Под графическим изображением подразумевают: схемы, рисунки, графические объекты и карты изображений в форматах JPEG, GIF (включая прозрачные и анимированные), PNG.

Элемент IMG не имеет конечного тэга.

Тег <IMG> имеет следующие атрибуты:

Атрибут: Src

Атрибут этот является важным параметром. Указывает адрес (URL-адрес) до графического файла, или же название самого графического файла (если HTML документ находится в той же папке с графическим файлом) с расширением (поддерживаются *.jpg, *.gif, *.png).

Атрибут: Width

Определяет ширину изображения в пикселях.

Атрибут: Height

Определяет высоту изображения в пикселях.

Обязательно задаются значения параметров "width" и "heght", резервируя тем самым место в окне браузера еще до загрузки изображения. В противном случае документ при загрузке каждой картинки будет заново перерисовываться. А на медленных машинах или при подключении к сети посредством модема это просто плохо смотрится [3].

Атрибут: Hspace

Он определяет отступ картинки (в пикселах) по горизонтали от других объектов документа. При помощи указанного числа пикселей отдаляет изображение от текста.

Атрибут: Vspace

Определяет отступ картинки (в пикселах) по вертикали от других объектов документа. Так же необходим при отдалении изображения от текста.

Здесь можно посмотреть примеры применения этих атрибутов.[2]

Важно указывать значения параметров Hspace и Vspace, если вы хотите оставитьизображение от текста. Бывает, что некоторые браузеры по умолчанию присваивают им какое-то небольшое значение, не равное нулю.

Атрибут: Align

Обязательный параметр. Указывает способ выравнивания изображения в документе. Может принимать следующие значения:

Left

Выравнивание по левому краю документа. Прилегающий текст обтекает изображение справа.

Right

Выравнивание по правому краю документа. Прилегающий текст обтекает изображение слева.

top и texttop

Выравнивают верхнюю кромку изображения с верхней линией текущей текстовой строки.

Middle

Выравнивает базовую линию текущей текстовой строки с центром изображения.

Absmiddle

Выравнивает центр текущей текстовой строки с центром изображения.

Absbottom

Выравнивает нижнюю кромку изображения с нижней кромкой текущей текстовой строки.

Здесь можно посмотреть действие всех значений атрибута "Align" элемента <Img>

bottom и baseline

Выравнивает нижнюю кромку изображения с базовой линией текущей текстовой строки.

Атрибут: Name

Указывает имя изображения, уникальное для данного документа. Имя можно указывать любое без пробелов с использованием латинских символов и цифр. Если необходимо, то нужно осуществлять доступ к изображению, например, из JavaScript-сценариев.

Обычно это для изображения, не связанного ни с чем, этот параметр совсем не обязательный.

Атрибут: Alt

Это атрибут, который при ошибке выводит вместо картинки, если браузер по какой - либо причине не смог отобразить изображение (не найдена или пользователь настроил свой обозреватель так, что тот не показывает картинки). Помимо того, при наваждении курсора мыши можно увидеть этот текст в виде подсказки, когда курсор мыши находится на рисунке.

Атрибут: Border

Он позволяет создать рамку в ширину вокруг изображения в пикселах. Рамка не появляется при условии, если этот атрибут не указан в теге <Img>, только если изображение является гипертекстовой ссылкой. В таких случаях значение Border обычно указывают равным нулю.

Записывается так:

Атрибут: Lowsrc

Указывает адрес (URL) графического файла с расширением с альтернативным изображением более низкого качества, чем изображение, указанное в параметре SRC. Обозреватели, поддерживающие данный параметр, сначала загрузят картинку из LOWSRC, а затем заменят ее картинкой из SRC. Не обязательный параметр.

Ниже на рисунке 9 показана наша ранее созданная Web-страница со вставленным изображением.

Рисунок 9 – Web-страница

В Приложении А будет представлен код страницы.

2.3. Создание таблиц с помощью HTML

В Web-странице находится один из самых главных инструментов, является таблица.

Без использования CSS, только с помощью таблиц можно создавать страницы со сложным дизайном. Любая таблица представляет собой набор строк и столбцов, на пересечении которых находятся ячейки

Таблицы в HTML организуются как набор столбцов и строк. В ячейках таблицы могут содержать любые HTML-элементы, такие, как списки, абзацы, фигуры, изображения, заголовки, тексты, а также элементы форм [9].

Основные тэги таблицы

Таблица:<TABLE> ...</TABLE>

Далее идут основные теги основные тэги, описывающие таблицу. Все элементы таблицы должны находиться внутри этих двух тэгов. Когда создается таблица, по умолчанию таблица не имеет обрамления и разделителей. Обрамление добавляется атрибутом BORDER.

Строка таблицы:<TR>...</TR>

Сколько присутствует пар <TR>..</TR>, такое количество строк таблицы определяется в таблице. Строки могут иметь атрибут VALIGN и ALIGN, которые описывают визуальное положение содержимого строк в таблице.

Ячейка таблицы:<TD>...</TD>

Описывает стандартную ячейку таблицы. Ячейка таблицы может быть описана только внутри строки таблицы. Каждая ячейка должна быть пронумерована номером колонки, для которой она описывается. Если в строке отсутствует одна или несколько ячеек для некоторых колонок, то браузер отображает пустую ячейку. Расположение данных в ячейке по умолчанию определяется атрибутами ALIGN=left и VALIGN=middle. Данное расположение может быть исправлено как на уровне описания строки, так и на уровне описания ячейки [10].

Заголовок таблицы: <TH>...</TH>

Ячейка заголовка таблицы имеет ширину всей таблицы; текст в данной ячейке имеет атрибут BOLD и ALIGN=center.

Подпись:<CAPTION>...</CAPTION>

Данный тэг описывает название таблицы (подпись). Тэг <CAPTION>должен присутствовать внутри <TABLE>...</TABLE>, но снаружи описания какой-либо строки или ячейки. По умолчанию <CAPTION>имеет атрибут ALIGN=top, но может быть явно установлен в ALIGN=bottom. ALIGN определяет, где - сверху или снизу таблицы - будет поставлена подпись. Подпись всегда центрирована в рамках ширины таблицы [11].

Основные атрибуты таблицы

WIDTH

Определяет размер в процентах от ширины экрана. Используется в тегах <TABLE>, <TR>, <TH>.

Например WIDTH="60%"

BGCOLOR

Задаёт фоновый цвет. Используется в тегах <TABLE>, <TR>, <TH>.

BORDERCOLOR

Задаёт цвет рамки. Используется в тегах <TABLE>, <TR>, <TH>.

CELLPADDING

Задает расстояние между содержимым ячейки и ее рамкой в пикселях. Используется в теге <TABLE>.

CELLSPACING

Задает расстояние между ячейками таблицы в пикселях. Используется в теге <TABLE>.

BORDER

Данный атрибут используется в тэге TABLE. Если данный атрибут присутствует, граница таблицы прорисовывается для всех ячеек и для таблицы в целом. BORDER может принимать числовое значение, определяющее ширину границы, например BORDER=3.

ALIGN

Если атрибут ALIGN присутствует внутри тэгов <CAPTION>и </CAPTION>, то он определяет положение подписи для таблицы (сверху или снизу). По умолчанию ALIGN=top.

Если атрибут ALIGN встречается внутри ;<TR>, <TH>или <TD>, он управляет положением данных в ячейках по горизонтали. Может принимать значения left (слева), right (справа) или center (по центру).

VALIGN

Данный атрибут встречается внутри тэгов <TR>, <TH>и <TD>. Он определяет вертикальное размещение данных в ячейках. Может принимать значения top(вверху), bottom(внизу), middle(по середине) и baseline(все ячейки строки прижаты кверху).

NOWRAP

Данный атрибут говорит о том, что данные в ячейке не могут логически разбиваться на несколько строк и должны быть представлены одной строкой.

COLSPAN

Указывает, какое количество ячеек будет объединено по горизонтали для указанной ячейки. По умолчанию 1.

ROWSPAN

Указывает, какое количество ячеек будет объединено по вертикали для указанной ячейки. По умолчанию 1.

Ниже на рисунке 10 показана таблица, созданная с помощью HTML.

Рисунок 10 – Таблица, созданная с помощью HTML

В Приложении B будет представлен код страницы.

Таким образом, Web-страницы создаются с помощью любого текстового редактора, так как они представлены в виде отдельного текстового файла. Страница может содержать в себе не только текст, но и множество других элементов (таблицы, оформление текста, иллюстрации и т. п.), в текст встраиваются специальные управляющие конструкции, которые называются тегами. При открытии HTML файла в браузере, он способен расшифровать теги и показать страницу в своём окне так, как она была задумана создателем. При обучении тегов в HTML нет необходимости помещать страницы на действующий сайт в Internet, достаточно всего лишь хранить их в виде файлов на конкретной рабочей станции или на сервере локальной сети.

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

Используя возможности языка HTML можно вставить в тело документа графические изображения: схемы, рисунки, графические объекты и карты, фотографии в форматах JPEG, GIF, PNG.

ЗАКЛЮЧЕНИЕ

Сейчас Интернет занимает очень важную часть нашей жизни. Работа с языком HTML даёт нам возможность создавать собственные веб-сайты и приложения. Для разработки, как правило, использую обычное ПО, так и специальные программы.

HTML — это обычный текстовый документ, но в записи используется набор управляющих команд (тегов), которые соответствуют определенному стандарту и интерпретируются браузером при отображении веб-страницы.

В ходе выполнения курсовой работы были решены следующие задачи:

проанализирована научная литература и интернет источники по теме курсовой работы;
рассмотрены основы языка гипертекстовой разметки HTML;
выявлены особенности работы с языком гипертекстовой разметки HTML;
проведен анализ современных веб-сайтов;
создана простая веб-страница с помощью HTML.

Таким образом, язык HTML представляет широкие возможности для создания как отдельных Web-страниц, так и сайтов, электронные портфолио, электронных учебный пособий.

БИБЛИОГРАФИЯ

Агулар Р. Html и Css. Основа Любого Сайта:книга / Р. Агулар.-М.: Эксмо, 2010. - 43с.
Алленова Н.В. Учебник по HTML [Электронный ресурс]. – 2015. – Режим доступа: http://books.laborant.org.ua/html/158777/index.shtml.- Дата обращения: 12.01.2020.
Бунаков А.Д. Оформление текства с помощью языка HTML [Электронный ресурс]. – 2014. – Режим доступа: http://www.metabo.com.ru/design/tuts.htm Дата обращения: 12.01.2020.
Глушаков С.В., Жакин И.А., Хачиров Т.С. Программирование Web-Страниц:книга / С.В. Глушаков,И.А. Жакин,Т.С. Хачиров.: М-2015. - 37с.
Гончаров А. Самоучитель Html:книга / А.Гончаров .-Спб.: Питер, 2015. - 40с.
Кастро Э. Html И Css Для Создания Web-Страниц:книга / Э. Кастро Издательство: Нт Пресс, 2012 Г. - 34с.
Кожемякин А.А. Html И Css В Примерах. Создание Web-Страниц:книга / А.А. Кожемякин Инфрам, 2011. - 43с.
Кузницов М.А. Основы языка HTML [Электронный ресурс]. – 2015. – Режим доступа: http://www.rzn62.narod.ru Дата обращения: 11.01.2020
Мишанов. А.Е. Создание документов в стандарте HTML [Электронный ресурс]. – 2014. – Режим доступа: http://www.arachnoid.com/arachnophilia"www.arachnoid.com/arachnophilia Дата обращения: 11.01.2020
Муссиано Ч. И. Кеннеди Б. Html И Xhtml:книга / Ч. И Муссиано Б. Кеннеди. – Спб.: Символ-Плюс, 2010. - 35с.
Петюшкин А. Html. Экспресс-Курс:книга /А. Петюшкин.-Спб.: Бхв-Петербург, 2010. - 25с.
Полонская Е.Л. Язык Html:книга / Е.Л. Полонская.-М.: Диалектика, 2009.-35с.
Программирование, компьютеры и кибернетика [Электронный ресурс]: http://www.allbest.ru. - Дата обращения: 11.01.2020
Рева О.Н. Html. Просто Как Дважды Два:книга /О.Н. Рева - М.:Эксмо, 2011. - 44с.
Словари и энциклопедии на Академике [Электронный ресурс]: http://dic.academic.ru/.-Дата обращения: 11.01.2020
Ссылки-гиперссылки в HTML [Электронный ресурс]: http:// hyperlink .- Дата обращения: 11.01.2020.
Храпоничева Ю.А. Создание Web-страниц с помощью языка HTML. Учебно-методическое пособие. Ю.А.Храпоничева. - Орёл: ГОУ ВПО «Орловский государственный университет» ,2010. - 30 с.
Эрик А. Мейер CSS Каскадные таблицы стилей:книга / А. Эрик . - Спб.: Символ-Плюс, 2009. - 41с.

Смотрите также файлы

Вариант 1. Информация в материальном мире.pdf

Правовое положение иностранцев и лиц без гражданства в РФ(Основная часть).pdf

Правовое положение иностранцев и лиц без гражданства в РФ.pdf

Основы программирования на языке QBasic.pdf

Формы государственного устройства (Понятие, формы и принципы государственного устройства).pdf

Файл: Основы программирования на языке HTML (Изучение предметной области).pdf

ЗАКЛЮЧЕНИЕ

БИБЛИОГРАФИЯ

Смотрите также файлы

Информация

Списки файлов

Дополнительно