'

РАЗМЕЩЕНИЕ ИНФОРМАЦИИ В ИНТЕРНЕТ РАЗРАБОТКА WEB-ПРИЛОЖЕНИЙ

Понравилась презентация – покажи это...





Слайд 0

РАЗМЕЩЕНИЕ ИНФОРМАЦИИ В ИНТЕРНЕТ РАЗРАБОТКА WEB-ПРИЛОЖЕНИЙ


Слайд 1

Язык HTML HTML (Hyper Text Markup Language) - язык разметки гипертекстовых документов. Язык разметки гипертекстовых документов HTML представляет собой совокупность команд, называемых тегами (от английского tag). Назначение HTML-тегов Форматирование текста; Форматирование таблиц и списков; Организация ссылок на другие ресурсы; Описание фреймов; Вставка изображений и расширений HTML.


Слайд 2

Формат HTML–тегов HTML-тег записывается в угловых скобках и состоит из имени, за которым может следовать список атрибутов. Атрибуты – элементы, дающие браузеру дополнительную информацию об отображении размещаемой информации. Большинство тегов имеют два компонента: открывающий и закрывающий (парные теги). Закрывающий компонент имеет то же название, но при записи перед названием ставится символ « / ». Общий вид парного тега: <имя тега>текст</имя тега> Пример: <title> Пробная страница </title> Существуют также непарные теги. Общий вид непарного тега: <имя тега> Пример: <br> Общий вид тега с атрибутами: <имя тега атрибут 1=значение … атрибут n=значение> текст </имя тега> Пример: <font color=“green” size=3> Проба </font>


Слайд 3

Структура HTML-документа


Слайд 4

Пример простейшего HTML-документа <HTML> <HEAD> <TITLE>Пример HTML-документа</TITLE> </HEAD> <BODY bgcolor="#00FF00"> Hello!!! </BODY> </HTML> Тег <HTML> указывает программе просмотра страниц что это HTML документ. Тег <HEAD> определяет место, где помещается различная информация не отображаемая в теле документа. Здесь располагается тег названия документа. Тег <TITLE> - тег названия документа. Текст внутри него отображается не на странице, а как заголовок окна браузера. Тег <BODY> определяет видимую часть документа. В этом разделе располагается вся содержательная часть документа (текст статьи, фотографии, формы для заполнения, другие объекты). Атрибут bgcolor устанавливает цвет фона документа, используя значение цвета в виде RGB (возможно использование константы цвета, например “yellow”).


Слайд 5

Названия основных цветов и значения RGB Чувствительность к регистру При написании имен тегов, атрибутов и большинства значений атрибутов язык HTML нечувствителен к регистру. Например, можно написать TITLE, или Title, или title, или даже tItLE.


Слайд 6

Теги форматирования текстовых фрагментов <I> Курсив <B> Жирный шрифт <U> Подчеркнутый текст <H1> заголовок 1-го уровня (самый большой) . . . <H6> заголовок 6-го уровня (самый маленький) <BR> перевод строки (непарный) <HR> для рисования горизонтальной черты в качестве разделителя (непарный) <FONT> определяет выводимый шрифт, его цвет и размер (парный) Атрибуты: color - цвет текста face - гарнитуру шрифта size - размер текста в пределах от 1 до 7, где 1 - самый мелкий шрифт. По умолчанию равен 3 <P> начало нового параграфа (абзаца) (парный) Атрибут: align - выравнивает параграф относительно одной из сторон документа, значения: left, right, или center парные теги


Слайд 7

Встраивание в документ иллюстраций Графические форматы GIF - Graphic Interchange Format. При сохранении изображения в этом формате количество используемых цветов не превышает 256. JPEG (JPG) - Joint Photography Experts Group. Этот формат допускает сохранение изображений, содержащих миллионы цветов. <IMG> - тег для внедрения графики на страницу Атрибуты src - обязательный атрибут, указывающий URL рисунка. align - выравнивает изображение к одной из сторон документа: left - по левому краю right - по правому краю center - по центру bottom - по нижнему краю top - по верхнему краю middle – посередине. alt - выводит текст к картинке. Полезно, если браузер не отображает графику на странице border - устанавливает толщину рамки вокруг изображения в пикселах. По умолчанию рамка не используется. height - высота картинки в пикселах или процентах. Желательно явно устанавливать этот параметр для ускорения загрузки страницы браузером. hspace - определяет размер свободного места в пикселах слева и справа от изображения. vspace - определяет размер свободного места в пикселах сверху и снизу от изображения. width - ширина картинки в пикселах или процентах. (Желательно устанавливать явно).


Слайд 8

Использование списков Виды списков – нумерованные и маркированные. <UL> и </UL> - для маркированного списка Атрибут: type - тип маркера disk - закрашенный кружок (по умолчанию) circle - незакрашенный кружок square - квадратик <OL> и </OL> - для нумерованного списка Атрибуты: type - тип маркера A - заглавные буквы a - строчные буквы I - заглавные римские цифры i - строчные римские цифры 1 - арабские цифры (по умолчанию) start - начальное значение для нумерованного списка при использовании арабских цифр <LI> - элементы списка (непарный) Элемент любого списка может содержать в себе другой список любого вида (число уровней формально не ограничено)


Слайд 9

Организация ссылок Гипертекст позволяет осуществлять мгновенный переход от одного фрагмента текста к другому. Для создания гипертекста (гиперссылок) служит тег <A>. Закрывающий тег обязателен. Атрибут href - задает URL ресурса, на который должен перейти пользователь, щелкнув по ссылке. Атрибут может указывать как на внешний документ, так и на документ, расположенный в той же папке, что и исходный файл (в этом случае в достаточно указать имя файла – его относительный адрес). Документы одного сайта рекомендуется связывать относительными ссылками, чтобы не потерять их при перемещении с одного компьютера на другой. Пример: <A href="page2.htm">текст</A> В качестве ссылки может использоваться графический элемент или комбинация текста и графики. Примеры: <A href="start.htm"><IMG src="photo1.jpg"</A> <A href=«page2.htm"><IMG src="photo2.jpg“<br>страница 2</A>


×

HTML:





Ссылка: