Реферат: Мировые информационные ресурсы

<UL TYPE=disc, square, circle>

<LI>abc</LI>

</UL>

Где disc – жирная точка; square - квадрат; circle – не закрашенная окружность.

При отображении элементов списка браузер делает отступ слева.

Многоуровневые списки.

Например:

<UL TYPE=disc, square, circle>

<LI>abc</LI>

            <UL>

                        <LI>def</LI>

<LI>ghi</LI>

</UL>

</UL>

Отобразиться:

• abc
• def
• ghi

Браузер будет делать очередной отступ слева.

Таблицы.

1. Парный дескриптор <TABLE>…</TABLE>

В его контейнере должны быть сформированы элементы таблицы (ячейки) в которых и будет информация.

2. Парный дескриптор <TR>…</TR> - формирует строку таблицы.

3. Парный дескриптор <TD>…</TD> - формирует ячейку внутри строки.

Пример:

<TABLE>

<TD>1</TD>	<TD>2</TD>
<TD>3</TD>	<TD>4</TD>

<TR>   <TR>

<TR>   <TR>
                                               </TABLE>

Атрибуты дескриптора <TABLE>:

• Атрибут WIDTH – определяет ширину таблицы (в процентах или пикселях).

Пример:

<TABLE WIDTH=100% или WIDTH=200>

• Атрибут HEIGHT – высота (принимает такие же значения, как и атрибут WIDTH).
• Атрибут ALIGN – выравнивание таблицы по ширине относительно краев окна.
• Атрибут BORDER – определяет ширину рамки (если значение данного атрибута 0, то рамки отсутствуют).
• Атрибут bgcolor – для формирования фона таблицы с помощью цвета.
• Атрибут background - для формирования фона таблицы с помощью картинки.
• Атрибут cellpadding – для указания отступов от краев ячейки (в пикселях).
• Атрибут cellspacing – расстояние между ячейками.

	Если значение атрибута больше нуля, то таблица выглядит так:

Обычная таблица           

                                                          

• Атрибут bordercolor – цвет границ ячеек (рамки).

Атрибуты дескриптора <TR>:

1)    Атрибут ALIGN – выравнивание текста в ячейках.

2)    Атрибут VALIGN – определяет вертикальное выравнивание текста в ячейках.

Возможные значения атрибута VALIGN:

·     =TOP – по верху.          

·     =MIDDLE – по центру.

·     =BOTTOM – по нижнему краю ячейки.

 

     3)Атрибут bgcolor – для указания фона строки.

Атрибуты дескриптора <TD>:

• Атрибут ALIGN.
• Атрибут VALIGN.
• Атрибут bgcolor.

Вышеперечисленные атрибуты действуют так же, как для дескриптора <TR>.

            Дополнительно атрибуты:

• Атрибут COLSPAN – объединение ячеек, находящихся в одной строке. Значение атрибута равно количеству близлежащих ячеек находящихся в одной строке, которые будут объединены.

Пример:

<TABLE>

<TD COLSPAN=2>1</TD>
<TD>3</TD>	<TD>4</TD>

<TR>   </TR>

<TR>   </TR>

</TABLE>

 

• Атрибут ROWSPAN – объединение ячеек, находящихся в одном столбце. Значение атрибута указывает количество близлежащих ячеек находящихся в одном столбце, которые будут объединены.

Пример:

<TABLE>

<TD ROWSPAN=2>1</TD>	<TD>2</TD>
	<TD>4</TD>

<TR>   </TR>

<TR>   </TR>

</TABLE>

Форматирование текстовых фрагментов HTML документа

Кроме ширины и высоты таблицы в целом можно регулировать ширину и высоту ячеек (то есть использовать такие же атрибуты в дескрипторе <TD>, в пикселях и в процентах).

Если они не указаны, то браузер выравнивает размер ячейки по ширине текста.

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

Пример:

Чтобы добавить такую таблицу в контейнере дескриптора ячейки пишут следующее:

<TD>

<TABLE>

<TR><TD></TD><TD></TD></TR>

<TR><TD></TD><TD></TD></TR>

</TABLE>

                   <TD>

Фон отдельных ячеек могут отображать не все браузеры.

Размещение графических изображений в HTML документе

 

Для размещения изображений используются в основном два графических формата:

• JPG
• GIF

1.Формат JPG.

Плюсы - Графическое изображение, сохраненное в данном формате, имеют наименьший объем.

Минусы – при сохранении происходит довольно сильное сжатие картинки, а при сжатии изображение теряет качество и наблюдается эффект пикселизации.

Пример:

Картинка сжалась в девять раз.

 

Девять пикселей заменяются одним пикселем среднего цвета.

Изображение сохраняется в формате .jpg в том случае, если необходимо сохранить максимальное количество оттенков.

2.Формат GIF.

При сохранении картинок в этом формате также происходит сжатие, но пикселизации не происходит.

Минусы – изображение сохраняется с помощью ограниченного количества цветов (обычно 256 цветов) => изображение будет не очень красочным.

С помощью формата .gif сохраняются навигационные кнопки, навигационные графические элементы и фоновые изображения.

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

• Атрибут SRC –  основной атрибут. Он указывает путь и имя файла, в котором содержится графический элемент.

Пример:

<IMG SRC=1.gif>

• Атрибут WIDTH – ширина внедряемого изображения (в пикселях).
• Атрибут HEIGHT - высота внедряемого изображения (в пикселях).
• Атрибуты VSPACE, HSPACE – устанавливают отступ текста от внедряемого в HTML документ изображения.
• Атрибут BORDER – задает толщину рамки вокруг изображения.
• Атрибут ALT – задает альтернативный текст, который появляется в том месте, где должны быть картинки.

Пример:

ALT=”Здесь была картинка”.

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

• Атрибут ALIGN – выравнивание.

Возможные значения:

=LEFT, CENTER, RIGHT.       

Добавляются значения: =TOP, MIDDLE, BOTTOM.

• Если не используются атрибуты WIDTH, HEIGHT, то изображение внедряется оригинального размера.

Если используется только один атрибут, например HEIGHT, то браузер уменьшит или увеличит ширину пропорционально изображению.

Использование  гипрессылок

Гипрессылка – это URL адрес того документа, который привязан к одному из элементов Web страницы (текстовому или графическому).

Для внедрения ссылок в HTML документ применяется парный дескриптор <A>…</A>.

Пример:

<A HREF=”http://www.kirov.ru/price.htm”>

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

</A>

В результате на экране отображается подчеркнутый выделенный текст.

Пример привязки к изображению:

<A>

<IMG SRC=”1.gif”>

</A>

Изображение, к которому привязывается ссылка, называется навигационной картинкой (изображением).

В случае привязки к картинке ссылки вокруг картинки формируется рамка (чаще всего синего цвета). Чтобы ее убрать, необходимо указать:

<IMG border=”0”>

Значением атрибута HREF может быть абсолютный адрес (URL адрес) или относительный адрес (имя файла, в котором хранится HTML документ, указываемый с помощью ссылки). Например, HREF=”1.htm”. Браузер будет искать данный документ в текущей папке, то есть в той, в которой находится активный документ.

Исключение составляет дескриптор <BASE>

<BASE URL=”http://www.kirow.ru”>

В случае использования данного дескриптора в заголовке HTML документа (то есть контейнера HEAD)относительные адреса (указанные в виде значений HREF) будут восприниматься браузером не относительно текущей папки, а относительно URL адреса, указанного в значении атрибута URL.

Использование дескриптора <A>…</A>

для указания отдельных элементов HTML документов.

1. Атрибут NAME используется для указания места, до которого необходимо пролистать

HTML документ.

 Пример:

<A NAME=”ZDES”>

</A>

В этом случае внутри дескриптора <A> находится якорь – это элемент HTML документа, который может быть адресован с помощью гиперссылки. Якорь не выделяется браузером.  

 

Для того чтобы с помощью ссылки адресоваться к якорю надо после URL адреса добавить # и указать имя якоря.

Пример:

<A HREF=”http://www.kirov.ru/price.htm#1>

Название якоря может формироваться без указания URL адреса HTML документа.

Пример:

<A HREF=”#1”>

Данный якорь будет искаться в текущей папке.

При использовании абсолютного адреса необходимо использовать аббревиатуру http (например, http://www.kirov.ru).

HTML форма

Форма (в документе HTML) – это средство, позволяющее организовать диалог пользователя и Web сайта.

Основные виды HTML форм:

1)    Кнопки.

2)    Списки.

3)    Текстовые поля.

4)    Переключатели (флажки).

5)    Радиокнопки.

Элементы управления HTML форм позволяют пользователю вводить информацию с помощью браузера и отправлять её на обработку Web сайту.

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

Группа дескрипторов, формирующих HTML форму.

1. Парный дескриптор <FORM> - задает свойство формы и содержит в своем контейнере элементы этой формы.

Атрибуты:

• Атрибут NAME – для задания имя формы.

Например, NAME=”anketa”.

! Каждый элемент HTML формы, как и сама форма, должны быть обязательно поименованы.

• Атрибут METHOD – определяет, каким способом HTML форма будет отправляться к программе-обработчику.

Есть два варианта:

             1)=POST – используется чаще всего.

             2)=GET – используется для отправки HTML формы с помощью URL адреса.

(По умолчанию задается метод GET).

• Атрибут ACTION – задает местоположение программы-обработчика. Значением атрибута служит адрес (абсолютный или относительный).

Например,

 ACTION=”executive.php” – файл, в котором хранится программа-обработчик.

Или ACTION=“mailto:a@kirov.ru” – пользовательская форма будет отсылаться по указанному электронному адресу.

• Атрибут ENCTYPE – тип кодировки.

Варианты:

=”text/htm/”

=”text/plain” – обычный текст без элементов форматирования.

Элементы HTML форм

1.Текстовые поля.

   Бывают двух видов:

1)    Многострочное. Парный дескриптор <TEXTAREA>…</TEXTAREA>

Страницы: 1, 2, 3, 4, 5, 6