Смекни!
smekni.com

Специализированные языки разметки документов HTML (стр. 9 из 16)

<TABLE align=center border=3>

<CAPTION align=center>

Самые знаменитые алмазы

</CAPTION>

<TR align=center>

<TH> Название </TH>

<TH> Страна </TH>

<TH> Год </TH>

<TH>Масса в каратах</TH>

</TR>

<TR>

<TD>Куллинан</TD>

<TD>Южная Африка</TD>

< TD >1905</ TD >

< TD >3106</ TD >

</ TR >

< TR >

< TD >Эксцельсиор</ TD >

< TD >Южная Африка</ TD >

< TD >1893</ TD >

< TD >971.5</ TD >

</ TR >

<TR>

<TD>Звезда Сьерра-Леоне</TD>

<TD>Западная Африка</TD>

<TD>1972</TD>

<TD>968.9</TD>

</TR>

</TABLE>

2. Объединение строк и столбцов таблицы.

<TABLE align=center border=3>

<CAPTION align=center>

Магазин предлагает учебники

</CAPTION>

<TR align=center>

<TH> Предмет </TH>

<TH> Раздел </TH>

<TH> Классы </TH>

</TR>

<TR>

<TD rowspan=4> Математика </TD>

<TD> Арифметика </TD>

<TD>1 - 4</TD>

</TR>

<TR>

<TD> Алгебра </TD>

<TD>5 - 11</TD>

</TR>

<TR>

<TD> Геометрия </TD>

<TD>7 - 11</TD>

</TR>

<TR>

<TD colspan=2>Количество наименований: 1090</TD>

</TR>

<TR>

<TD rowspan=3> Физика </TD>

<TD> Механика </TD>

<TD>5 - 7</TD>

</TR>

<TR>

<TD> Оптика </TD>

< TD >10 - 11</ TD >

</ TR >

< TR >

< TD colspan =2>Количество наименований: 457</ TD >

</ TR >

</ TABLE >

3. Вложенные таблицы. Команды, управляющие созданием и отображением таблиц, допускают вложение одного тега < TABLE > внутрь другого. Эта особенность языка используется для представления "вложенных" таблиц.


<TABLE align=center border=3>

<CAPTION align=center>

Магазин предлагает учебники

</CAPTION>

<TR align=center>

<TH> Предмет </TH>

<TH> Раздел </TH>

<TH> Классы </TH>

</ TR >

< TR >

< TD > Математика</ TD >

<TD colspan=2>

<TABLE border=4>

<TR>

<TD> Арифметика </TD>

<TD>1 - 4</TD>

</TR>

<TR>

<TD> Алгебра </TD>

<TD>5 - 11</TD>

</TR>

<TR>

<TD> Геометрия </TD>

<TD>7 - 11</TD>

</TR>

<TR>

<TD colspan=2>

Количество наименований: 1090

</TD>

</ TR >

</ TABLE >

<TR>

<TD> Физика </TD>

<TD colspan=2>

<TABLE border=4>

<TR>

<TD> Механика </TD>

<TD>5 - 7</TD>

</TR>

<TR>

<TD> Оптика </TD>

<TD>10 - 11</TD>

</TR>

<TR>

<TD colspan=2>

Количество наименований: 457

</ TD >

</ TR >

</ TABLE >

</ TR >

</ TABLE >

6. Гиперссылки

Ссылка представляет собой логическую связь одного фрагмента (элемента) документа с другим фрагментом в том же самом или в другом документе. Ссылка характеризуется двумя точками, называемыми закладками. Различают начальную и конечную закладки.

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

Конечная закладка определяет точку назначения ссылки и может относиться не только к конкретному HTML -элементу, но и к программе или документу в целом.

В HTML различают внутренние и внешние гиперссылки. Внутренние ссылки осуществляют переход в пределах одного и того же документа. Внешние ссылки обеспечивают переходы к другим документам. Внешние ссылки и называют гиперссылками.

Текстовые гиперссылки можно разделить на четыре условных категории: ссылки на документы, ссылки на разделы, ссылки на адрес электронной почты, ссылки на файловые объекты.

6.1 Ссылки на документы

Для реализации простой гиперссылки на другую web-страницу можно использовать в html-документе тег <А>. Формат записи тега:

<А href =" URL "

target =”параметр”

title =”альтернативный текст">

Текст гиперссылки

</А>

Атрибут href указывает на адрес страницы, с которой нужно установить гиперсвязь. Этот адрес может быть представлен как в виде полного URL (например, "http: // www. server. ru/page. htin1"), так и в виде сокращенного URL с указанием пути к искомой странице в пределах локального сервера (например, "/ folder / page . html "). Если искомый документ расположен в одной директории с текущим, в качестве параметра атрибута href достаточно записать его название.

Атрибут target содержит директивы, описывающие правила открытия целевого документа в броузере, эти директивы выделяются в коде символом подчеркивания.

Значения атрибута target :

_ self отображает открываемый по ссылке документ HTML в текущем окне броузера;

_ blank отображает открываемый документ в новом окне;

_ parent загружает страницу во фрейм-родитель, если фреймов нет – в текущее окно;

_ top отменяет все фреймы и загружает страницу в полном окне, если фреймов нет – в текущем окне.

Атрибут title предназначен для создания так называемого альтернативного текста – всплывающей подсказки, появляющейся в небольшом прямоугольнике, если пользователь задержит курсор мыши над гиперссылкой на несколько секунд.

6.2 Ссылки на разделы

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

Первый заключается в подготовке так называемой "закладки" – специальной метки с уникальным в пределах данного документа именем, присваиваемым "закладке" посредством атрибута name . Для этого в том участке текста, где необходимо разместить метку, применяется следующая команда:

<А n а me ="имя_закладки">

Ключевое слово или заголовок раздела

</А>

Второй этап – создание самой ссылки при помощи команды:

<А hr е f ="#имя_закладки">Текст ссылки</А>

Для задания имени "закладки" лучше использовать латинские символы. При вызове раздела посредством гиперссылки имя "закладки" предваряется символом "#".

Если нужно разместить ссылку на раздел какого-либо другого документа, описанный выше алгоритм в целом сохраняется, за исключением того, что в вызывающем теге перед именем "закладки" указывается URL документа. В этом случае рекомендуется также использовать атрибут target с параметром _ blank . Подобная команда в обобщенном виде будет выглядеть следующим образом:

<А href = document. htm#имя_закладки

target ="_ blank ">

Текст ссылки

</А>

6.3 Ссылки на адрес электронной почты

При активизации такой ссылки автоматически запускается почтовая программа и на экране формируется уже готовый к отправке бланк электронного письма с заполненным адресным полем и иногда полем Subject . Ссылка на адрес электронной почты имеет формат:

<А hr ef =”ma ilto : user-l@se r ve r . r u? cc = user -2@ server . ru , user -3@ server . ru & subject =Тема_письма”>

Текст ссылки

</А>

Директива mailto : указывает на основной адрес электронной почты, куда следует отправлять письмо. В минимальной записи атрибута href при реализации гиперссылки на адрес электронной почты можно указать только эту директиву и какой-либо адрес e - mail .

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

C помощью функции & subject можно задать тему отсылаемого сообщения. Пример :

< А href=”mailto: ivanov@gsu. unibel. by&subject= Привет ”>

Жду писем!

</А>

6.4 Ссылки на файловые объекты

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

< А href="http: // www. myserver. com/files/archive. zip">

Te кст гиперссылки

</А>

Иногда для реализации гиперсвязи с файловым объектом в записи URL этого объекта используется префикс " file : // ", однако такой подход применяется в основном для организации ссылок на файловый объект, расположенный на локальном компьютере. Если загрузку файла планируется осуществлять по протоколу FTP , используйте префикс " ftp : // ". Если искомый файл расположен в той же директории, что и вызывающий его документ, в качестве значения атрибута href можно просто указать его имя.

7. Графика в web -дизайне

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

7.1 Сетевые графические форматы

Наиболее популярными форматами графических изображений являются GIF и JPEG . В этих форматах хранится 90% всей графики, представленной Интернете. В них заложены различные алгоритмы сжатия изображения с потерей качества, благодаря использованию которых удается значительно уменьшить размер целевого файла.

Стандарт GIF ( Graphic Interchange Format , формат обмена графическими данными) создан в 1987 году. Он позволяет значительно сокращать объем итогового графического файла по сравнению с исходным изображением за счет смешения сходных оттенков в один. Если, например, в составе рисунка имеется участок, состоящий из нескольких сходных полутонов, к примеру, голубого, светло-голубого и темно-голубого цвета, они будут кодированы одним оттенком – голубым. Информация об изображении в файле стандарта GIF записывается построчно, то есть представляет собой массив описаний строк высотой в один пиксел. Данный формат оперирует фиксированной, так называемой индексированной палитрой, число цветов в которой не превышает 256. Поэтому стандарт GIF используется в документах HTML только для отображения так называемой бизнес-графики: диаграмм, логотипов, кнопок, разделительных линий, других элементов оформления страницы (т.е. для рисованных изображений). Для размещения на web-сайте фотографий, репродукций картин и изображений с большим количеством цветов и цветовых переходов используется стандарт JPEG .