АвтоАвтоматизацияАрхитектураАстрономияАудитБиологияБухгалтерияВоенное делоГенетикаГеографияГеологияГосударствоДомДругоеЖурналистика и СМИИзобретательствоИностранные языкиИнформатикаИскусствоИсторияКомпьютерыКулинарияКультураЛексикологияЛитератураЛогикаМаркетингМатематикаМашиностроениеМедицинаМенеджментМеталлы и СваркаМеханикаМузыкаНаселениеОбразованиеОхрана безопасности жизниОхрана ТрудаПедагогикаПолитикаПравоПриборостроениеПрограммированиеПроизводствоПромышленностьПсихологияРадиоРегилияСвязьСоциологияСпортСтандартизацияСтроительствоТехнологииТорговляТуризмФизикаФизиологияФилософияФинансыХимияХозяйствоЦеннообразованиеЧерчениеЭкологияЭконометрикаЭкономикаЭлектроникаЮриспунденкция

Списки и таблицы

Читайте также:
  1. III. Статистические таблицы
  2. Активный запрос на создание таблицы
  3. Алгоритм 2.1. Построение выходной таблицы, столбиковой диаграммы и кумуляты
  4. Анализ оптимальной симплекс-таблицы
  5. Анализ таблицы видов деятельности (на следующей сессии)
  6. Анализ таблицы сложения. Ознакомление дошкольников с арифметическими действиями и вычислительными приемами.
  7. Безработица является неотъемлемой чертой общества с рыночной экономикой, что наглядно видно по данным таблицы 3.1.
  8. Булева алгебра. Таблицы истинности. Основные законы.
  9. Ввод данных в таблицы. Редактирование записей данных
  10. Вместо денег – расписки «мудрого» ювелира
  11. Вспомогательные таблицы
  12. Вычисляемые таблицы.

Списки подразделяются на ненумерованные, создаваемые с тегом <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">&nbsp;<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>&nbsp;

<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>


1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | 141 | 142 | 143 |

Поиск по сайту:



Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Студалл.Орг (0.011 сек.)