 |
АвтоАвтоматизацияАрхитектураАстрономияАудитБиологияБухгалтерияВоенное делоГенетикаГеографияГеологияГосударствоДомДругоеЖурналистика и СМИИзобретательствоИностранные языкиИнформатикаИскусствоИсторияКомпьютерыКулинарияКультураЛексикологияЛитератураЛогикаМаркетингМатематикаМашиностроениеМедицинаМенеджментМеталлы и СваркаМеханикаМузыкаНаселениеОбразованиеОхрана безопасности жизниОхрана ТрудаПедагогикаПолитикаПравоПриборостроениеПрограммированиеПроизводствоПромышленностьПсихологияРадиоРегилияСвязьСоциологияСпортСтандартизацияСтроительствоТехнологииТорговляТуризмФизикаФизиологияФилософияФинансыХимияХозяйствоЦеннообразованиеЧерчениеЭкологияЭконометрикаЭкономикаЭлектроникаЮриспунденкция
Списки и таблицы
Списки подразделяются на ненумерованные, создаваемые с тегом <UL>,
и нумерованные, создаваемые с тегом OL:
<!--пример # 8: ненумерованные и нумерованные списки-->
<HTML><HEAD>
<TITLE>Использование списков </TITLE></HEAD>
<BODY>
<CENTER><H3>Домашняя страница </H3></CENTER>
<h4>Ненумерованный список: Мои интересы:</h4>
<UL>
<LH><B>Занятия в свободное время:</B></LH>
<LI> Компьютеры
<LI> Чтение книг
<LI> Бассейн
<LI> Отдых на природе
</UL> <HR>
<H4> Нумерованный (упорядоченный) список.</H4>
<OL TYPE=1>
<LH><B>Мое путешествие</B></LH>
<LI> Прибытие в Варшаву
<LI> Автобусом в Будапешт
<LI> Самолетом в Рим
</OL> <HR>
<OL TYPE=A>
<LH><B>Продолжение путешествия</B></LH>
<LI> Автобусом в Берлин
<LI> Поездом в Варшаву
<LI> Пешком в Минск
</OL> <HR>
</BODY></HTML>
Атрибуты ненумерованного списка: type="disk | circle | square". Атрибут нумерованного списка start - устанавливает число, с которого будет начинаться отсчет. При этом вид нумерации устанавливается аргументом TYPE: TYPE=1 – стандартная нумерация 1,2,3,4...; TYPE=A – прописные буквы A, B, C, D...; TYPE=a – строчные буквы a,b,c,d...; TYPE=I – римские цифры I, II, III, IV...; TYPE=i – строчные римские цифры i,ii,iii,iv,v....
Еще один вид списков – списки определений DL – состоит из пар элементов: определяемого <DT> и определения <DD>.
<!--пример #9: списки определений-->
<HTML><HEAD>
<TITLE>Использование списков</TITLE></HEAD>
<BODY> <CENTER><H2> Толковый словарь</H2></CENTER><HR>
<DL>
<LH><Big><B> Cписок терминов</B></Big></LH><HR>
<DT><B>"Anchor"</B>
<DD><I>То, что образовывает гипертекстовую ссылку</I>
<DT><B>"Lamer"</B>
<DD><I> Юзер-идиот</I>
<DT><B>"Cookies "</B>
<DD><I>Технология, позволяющая сохранять индивидуальную информацию о пользователе сети</I> </DL>
</BODY></HTML>
Для создания таблиц используются следующие теги HTML: <TABLE> и </TABLE> – охватывают таблицу. Для того чтобы была видна сетка, разделяющая строки и столбцы, используется атрибут BORDER (например: <TABLE BORDER=1>). Текст в тегах <CAPTION> и </CAPTION> выводится в виде заголовка. В тегах <TH> и </TH> помещаются заголовки столбцов или строк. Теги <TR> и </TR> определяют каждую строку таблицы. Теги <TD> и </TD> определяют текст каждой ячейки таблицы.
<!--пример # 10: простая таблица-->
<HTML><HEAD>
<TITLE>Использование таблиц</TITLE>
</HEAD><BODY>
<TABLE BORDER>
<CAPTION ALIGN=top>Лучшие нападающие года</CAPTION>
<TR>
<TH>Имя</TH>
<TH>Команда</TH>
<TH>Очки</TH>
</TR>
<TR>
<TD>Small </TD>
<TD> Барселона</TD>
<TD>5</TD>
</TR>
<TR>
<TD>Superman</TD>
<TD> Dinamo</TD>
<TD>10</TD>
</TR>
</TABLE></BODY></HTML>
Чтобы ячейка занимала две строки вместо одной, можно заменить тег на следующий: <TD ROWSPAN=2> </TD>. Аналогично два столбца можно объединить с помощью тега <TH COLSPAN=2> или <TD COLSPAN=2>. Изменить цвет в таблице можно с помощью аргумента BGCOLOR, как в следующем примере:
<!--пример # 11: изменение цвета-->
<HTML><HEAD>
<TITLE> Таблицы </TITLE></HEAD>
<BODY bgcolor="white">
<CENTER><FONT size=6>Примеры таблиц</font></center>
<HR color="blue">
<TABLE border=4 cellspacing=3>
<CAPTION><B>Стандартная таблица<B> </caption>
<TR><TH bgcolor="yellow">Заголовок 1
<TH bgcolor="yellow">Заголовок 2
<TR><TD>Ячейка 1
<TD>Ячейка 2
<TR><TD>Ячейка 3
<TD>Ячейка 4
</TABLE>
<HR color="blue">
<TABLE border="4" cellspacing=3 background="fon01.gif">
<CAPTION>Таблица с объединенными ячейками и фоновым
рисунком</caption>
<TR><TH rowspan="2"> <TH colspan="2">Заголовок 1
<TR><TH>Заголовок 1.1<TH>Заголовок 1.2
<TR><TH>Заголовок 2<TD>Ячейка 1<TD>Ячейка 2
<TR><TH>Заголовок 3<TD>Ячейка 3<TD>Ячейка 4
</TABLE>
<HR color="blue">
<H2>Использование элементов THEAD, TBODY и TFOOT</h2>
<TABLE border=2>
<THEAD>
<TR> <TD>Заголовок 1<TD>Заголовок 2
<TFOOT>
<TR> <TD>Нижний блок таблицы<TD>
<TBODY>
<TR> <TD>Строка 1 <TD>Ячейка 1.2
<TR> <TD>Строка 2 <TD>Ячейка 2.2
<TBODY>
<TR> <TD>Строка 3 <TD>Ячейка 3.2
<TR> <TD>Строка 4 <TD>Ячейка 4.2
<TR> <TD>Строка 5 <TD>Ячейка 5.2
</TABLE>
<HR color="blue">
<H2>Объединение ячеек</h2>
<TABLE border=4 cellspacing=0 width=70%>
<TR><TD bgcolor="yellow"><B>Заголовок 1</b>
<TD bgcolor="yellow"><B>Заголовок 2</b>
<TR><TD rowspan=3 bgcolor="lime">Ячейка 1
<TD>Ячейка 2
<TR><TD>Ячейка 3
<TR><TD>Ячейка 4
<TR><TD colspan=2 bgcolor="aqua" align="center">Ячейка 5
</TABLE>
<HR color="blue">
<H2>Вложенная таблица</h2>
<TABLE border=4 cellspacing=2 width=75%>
<TR><TD bgcolor="yellow">Таблица 1
<TD bgcolor="yellow">
<TABLE border=2 cellspacing=2>
<TR><TD bgcolor="red">Таблица 2
<TD bgcolor="red">Ячейка 2-2
<TR><TD bgcolor="red">Ячейка 3-2
<TD bgcolor="red">Ячейка 4-2
</TABLE>
<TR><TD bgcolor="yellow">Ячейка 3-1
<TD bgcolor="yellow">Ячейка 4-1
</TABLE></BODY></HTML>
Ссылки
HTML позволяет связать текст или картинку с другими гипертекстовыми документами с помощью тегов <A> и <LINK>. Текст, как правило, выделяется цветом или оформляется подчеркиванием. Чтобы сформировать ссылку, следует набрать <A, введите HREF= "filename">, ввести текст ссылки, закрыть тег </A>. В следующем примере слово Minsk ссылается на документ MinskAnapa.html, образуя гипертекстовую ссылку:
<A HREF="MinskAnapa.html">Minsk</A>.
Если документ, формирующий ссылку, находится в другой директории, то подобная ссылка называется относительной. Например:
<A HREF="MinskAnapa/MinskMoscow.html">Minsk</A>
Ссылки можно формировать на основе URL, используя синтаксис: protocol: //hostport/path. Например:
<A HREF="http://www.w3.org/TR/REC-html40">Документ HTML</A>
<!--пример # 12: создание ссылок на html-файлы-->
<HTML><HEAD>
<TITLE>Ссылки на домашней странице</TITLE></HEAD>
<BODY>
<H1>Внутренние ссылки на части документа</H1></CENTER>
<FONT SIZE=+1>
<HR NOSHADE>
<H2>Вы можете:</H2>
<UL>
<LI>Посмотреть <A HREF="Pr11.htm">Простейший пример</A>
<LI>Посмотреть <A HREF="Pr12.htm">Второй пример</A>
<LI>Посмотреть <A HREF="Pr13.htm">разбиение текста</A>
<LI>Узнать <A HREF="Pr14.htm">О линиях</A>
</UL>
<HR NOSHADE>
Если вас интересует подробная информация, пишите по адресу
<A HREF="mailto:Rom@Bsu.by">Rom@Bsu.by</A>
</FONT></BODY></HTML>
Поиск по сайту: