Поделиться
html справочник.ppt
HTML -справочник
Структура HTML -документа
Основные термины
Бегущая строка
Вставка графики, видео, звука
Фон
Списки и таблицы
Форматирование текста
Служебные тэги
Ссылки
Формы
Фреймы, изображение-карта
ОСНОВНЫЕ ТЕРМИНЫ
ОСНОВНЫЕ ТЕРМИНЫ
Cтруктура HTML-документа
(основные блоки)
тэги служебной информации
Атрибуты тэга
<META name=Description content="содержание страницы" >
описывает краткое содержание страницы
<META name=Author content="Имя автора" >
описывает имя автора страницы
<META HTTP-EQUIV=refresh content=5 url=http://www.upm.ipschool.spb.ru >
через 5 секунд автоматически загрузит сайт с указанным адресом, интервал времени и адрес задаем по своему усмотрению.
ФОРМАТИРОВАНИЕ ТЕКСТА
– выделение (аналогично тэгу )
– отмена выделения
– полужирный шрифт
– отмена полужирного шрифта
– увеличение шрифта относительно текущего
– отмена увеличения шрифта относительно текущего
– уменьшение шрифта относительно текущего
– отмена уменьшение шрифта относительно текущего
– переход на следующую строку
– отображение без изменения форматирования
– отмена отображения без изменения форматирования
– текст сдвигается вверх (верхний индекс)
– отмена сдвига
– текст сдвигается вниз (нижний индекс)
– отмена сдвига
– изменение шрифта
– отмена действия шрифта
Атрибуты тэга
Дизайн сайтов энциклопедий и музеев обычно разрабатывается профессиональными дизайнерами и может служить ориентиром для начинающих Web-мастеров. Для таких сайтов характерна тщательно продуманная цветовая гамма, строгая сдержанность.Например: http://www.arthistory
.
Пример дизайна:
http://www.metmuseum.org/home.asp
Пример дизайна:
http://www.louvre.fr
FACE = название шрифта –изменение гарнитуры (начертания) шрифта
Например:
текст
приведёт к выводу текста шрифтом Arial.
SIZE = размер шрифта – изменение размера шрифта фрагмента текста, используется в середине строки, т.к. после окончания своего действия не разбивает строку.
Например:
текст
Атрибуты могут перечисляться через пробел в произвольном порядке.
Например:
СOLOR= Black > текст
Абзац
– абзац
для выравнивания текста
текст
ФОН
Фон страницы задается в начале основной части документа, т.е. атрибутами тэга
Атрибуты тэга для изменения цвета текста и фона
TEXT= цвет или его код
Задает цвет текста
Например:
BACKGROUND= имя файла
использование в качестве фона изображение из файла. Изображение-текстуру можно создать в графическом редакторе или PowerPoint
BGPROPERTIES=FIXED
создание фона – “водяного знака”
(фона, который не перемещается вместе с текстом)
Вставка графических изображений
<IMG SRC=имя файла.расширение > – вставка картинки из файла
Атрибуты тэга
SRC=имя файла.расширение
ALT=название картинки или поясняющий текст
Используется в качестве текстового описания к данному изображению, появляется при наведении указателя мыши на картинку
WIDTH = ширина (в пикселях или в %)
Если этот атрибут указан одновременно с атрибутом HIGHT, то это дает возможность браузеру для очередного изображения заранее зарезервировать место на экране, еще до того, как сама картинка будет доставлена ему по сети.
HIGHT = высота (в пикселях или в %)
BORDER = число в пикселях
определяет рамку вокруг изображения
HSPACE = число в пикселях
VSPACE = число в пикселях
Определяют соответственно горизонтальный и вертикальный отступ вокруг изображения.
LEFT
ALIGN = RIGHT
CENTER
Используется, чтобы сдвинуть картинку к левому, правому краю, по центру и установить обтекание картинки текстом, а затем продолжить текст в пустой области за объектом.
LEFT
CLEAR = RIGHT
ALL
Используется, чтобы очистить поле слева, справа или с обеих сторон графического объекта, а затем продолжить текст в пустой области за объектом.
Вставка видео и звука
<BGSOUND SRC =имя файла>
вставка звукового файла
Например:
=имя файла>
вставка видео файла
Атрибут тэгов
n
LOOP = INFINITE
Количество повторений видео или звукового клипа и непрерывное повторение соответственно.
Списки
тэги для нумерованных списков:
(Ordered List) – начало списка
– конец списка
(List Item) – элемент списка
Атрибуты тэга для нумерованных списков
1
TYPE= A
I
…
нумерация арабскими цифрами, русскими буквами, римскими цифрами
SKIP=количество пропущенных номеров
Например:
Таблицы
Атрибуты тэга
| первая ячейка таблицы | вторая ячейка таблицы |
Например:
| первая ячейка таблицы | вторая ячейка таблицы |
Атрибуты тэга
Пример сложной таблицы .
| Ячейка 1 | Ячейка 2 | Ячейка 3 | |||
| Ячейка 4 | Ячейка 5 | Ячейка 6 |
Линии
Например:
Бегущая строка
n
LOOP = INFINITE
Определяет количество "прокруток" бегущей строки: при первом значении атрибута – n , при втором значении атрибута – бесконечно (по умолчанию)
TOP
ALIGN = MIDDLE
BOTTOM
Позволяет разместить текст в верхней, средней или нижней части области бегущей строки.
SCROLL
BEHAVIOR = SLADE
ALTERNATE
Определяет режим вывода ("поведения") бегущей строки: прокрутка циклическая, выход и остановка и прыжки соответственно.
![SCROLLAMOUNT = скорость перемещения текста или графики в строке [1…3000]](https://fs.znanio.ru/d5af0e/ad/56/48bea2266dbc54dcc360fabeb900b61768.jpg)
SCROLLAMOUNT = скорость перемещения текста или графики в строке [1…3000]
HIGHT=высота бегущей строки (в пикселях или в % от высоты экрана )
HSPACE= ширина в пикселях левого и правого полей между областью бегущей строки и окружающим её текстом или графикой
VSPACE= размер отступа в пикселях сверху и снизу от бегущей строки до текста или графики.
ГИПЕРССЫЛКИ
Можно организовать сообщение по электронной почте:
= mailto:адрес электронной почты >активный текст или изображение
Например:
активный текст или изображение
Атрибуты тэга для задания цвета ссылок
LINK= цвет или код цвета
Задает цвет ссылки
ALINK= цвет или код цвета
Задает цвет выбранной ссылки
VLINK= цвет или код цвета
Задает цвет просмотренной ссылки
Ссылки на метки
КАДРЫ
Кадры (frames) – это независимые части, на которые можно разбить окно броузера и в каждую часть можно загружать отдельную страницу. Эти страницы могут быть связаны между собой ссылками.
Количество частей (кадров) и их размеры, выбор горизонтального или вертикального деления, т.е. кадровая (фреймовая) структура задается тэгом.
Определяет фреймовую структуру.
Завершает определение фреймовой структуры.
Нужно отметить, что использование тэга
=имя файла.расширение>
Позволяет задать, какой документ (HTML-документ, текстовый или графический) будет загружаться в отдельный кадр.
Определяя структуру, указывают части сверху вниз и слева направо.
Атрибуты тэга
Атрибуты тэга
Например:
<FRAME SRC = my.htm NAME = right>
Если при этом в другом кадре загружен документе, содержащий тэг:
right >загрузить рисунок,
то по щелчку на словах "загрузить рисунок" рисунок 1.jpg загрузится в кадр, в котором до этого был загружен документ my.htm
Имена кадров могут начинаться с цифры или буквы. Для удобства можно указывать в качестве имени кадра слово, указывающее расположение кадра, например: top, bottom, right, left.
Еще один атрибут тэга <FRAME>:
NORESIZE
означает запрет перемещения мышкой границы между кадрами.
Фреймовую структуру можно создать также с помощью тэгов для создания таблиц и тэга
Этот тэг имеет такие же атрибуты, как и тэг <FRAME>.
Удобство в том, что не надо сначала создавать в отдельном документе фреймовую структуру, а потом задавать содержимое каждого фрейма. Любая ячейка может быть объявлена фреймом, для которого можно задать имя для обновления его содержимого по ссылкам из других ячеек.
Например:
На рисунке – окно, в котором фреймовая структура организована именно таким способом.
ИЗОБРАЖЕНИЕ-КАРТА
Атрибуты тэга Задаётся имя изображения-карты при помощи атрибута NAME.
NAME=имя
Атрибуты тэга
ALT=название области изображения-карты
Это атрибут для задания текста, заменяющего изображение-карту, не является обязательным.
TARGET=имя фрейма,
Определяет имя фрейма, в котором будет отображаться документ, на который делается ссылка с данной области.
Атрибут, определяющий форму области на карте
rect
SHAPE = poly
сircle
point
COORDS =x,y,x1,y1
Описывает координаты прямоугольной области rect (значениями атрибута будут координаты левого верхнего угла прямоугольника и правого нижнего, т.е. координаты противоположных его вершин).
COORDS =x,y,x1,y1… xn,yn
Описывает координаты многоугольной области poly (значениями атрибута будут пары координат всех вершин многоугольника).
COORDS =x,y,r
Описывает координаты области, имеющей вид окружности сircle (значениями атрибута будут координаты центра окружности и значение радиуса).
COORDS =x,y
Описывает координаты области, имеющей вид точки (значениями атрибута будут её координаты).
Для того, чтобы записать координаты выделенной области в качестве значения атрибута COORDS, нужно их определить:
1.загрузить картинку (которая станет изображением-картой) в графический редактор;
2.выделить с помощью соответствующего инструмента область (прямоугольную, окружность, или область произвольной формы);
3.в окне Информация нужно щёлкнуть в левом нижнем углу и выбрать Пиксели в качестве единицы измерения; 4.выделив, например, прямоугольную область на рисунке и подведя указатель мыши к левому верхнему углу, в окне Информация рядом с обозначениями X и Y можно увидеть и записать координаты этой вершины.
Но есть и более простой способ получить эти значения. Он доступен тогда, когда в графическом редакторе есть специальный фильтр. Вы можете его установить, и он добавится в список фильтров редактора (этот фильтр прилагается и находится в program/ plagins).
1. выделить произвольную область;
2. щёлкнув в главном меню редактора Фильтр|Ulead Web Plagins|Image Map Tag, в диалоговом окне увидим фрагмент кода, который нужно добавить в текст HTML-документа;
3. щелкнуть на кнопке To clipboard, и это фрагмент будет скопирован в буфер обмена, откуда его потом можно вставить в HTML-документ.
Видеосюжет, демонстрирующий этот способ - на следующем слайде.
Атрибуты тэга для изображения-карты
USEMAP = #имя
Определяет имя карты. Это имя должно совпадать с именем, которое указано в качестве значения атрибута NAME тэга
ФОРМЫ
Пример формы, содержащей разные поля
Атрибуты тэга
METHOD
Поля заполняемых форм
Материалы на данной страницы взяты из открытых источников либо размещены пользователем в соответствии с договором-офертой сайта. Вы можете сообщить о нарушении.
