- •Введение
- •Редакторы html
- •1. Первые html-документы
- •Обязательные теги
- •2. Форматирование текста и абзаца
- •Комментарии
- •Форматирование шрифта
- •Физические стили
- •Логические стили
- •Пример 4
- •3. Списки в тексте
- •4. Гиперссылки
- •Изображения в html-документе
- •Мета-инструкции
- •Пример 8
- •6. Таблицы
- •7. Формы
- •Пример 11
- •8. Фреймы
- •Упражнения на разработку web-страниц Упражнение 1
- •Упражнение 2.1
- •Упражнение 2.2
- •Упражнение 3
- •Упражнение 4.1
- •Упражнение 4.2
- •Упражнение 5.1
- •Упражнение 5.2
- •Упражнение 7.3
- •Упражнение 7.4
- •Упражнение 8.1
- •Упражнение 8.2
Пример 4
<html>
<head>
<title>Пример 4</title>
</head>
<body>
<H1>Шрифтовое выделение фрагментов текста</H1>
<P>Теперь мы знаем, что фрагменты текста можно выделять
<B>жирным</B> или <I>наклонным</I> шрифтом.
Кроме того, можно включать в текст фрагменты с фиксированной шириной символа
<TT>(имитация пишущей машинки)</TT></P>
<P>Кроме того, существует ряд логических стилей:</P>
<P><EM>EM - от английского emphasis - акцент </EM><BR>
<STRONG>STRONG - от английского strong emphasis -
сильный акцент </STRONG> <BR>
<CODE>CODE - для фрагментов исходных текстов </CODE> <BR>
<SAMP>SAMP - от английского sample - образец </SAMP> <BR>
<KBD>KBD - от английского keyboard -клавиатура</KBD> <BR>
<VAR>VAR - от английского variable - переменная </VAR> </P>
</body> </html>
3. Списки в тексте
HTML позволяет определять внешний вид целых абзацев текста. Абзацы можно организовывать в списки, выводить их на экран в отформатированном виде, или увеличивать левое поле.
Ненумерованные списки: <UL> ... </UL>
Текст, расположенный между тегами <UL> и </UL>, воспринимается как ненумерованный список. Каждый новый элемент списка следует начинать с тега <LI>. У тега <LI> нет парной закрывающей метки.
Например, чтобы создать вот такой список:
-
Иван;
-
Петр;
-
Никита
необходим такой HTML-текст:
<UL>
<LI>Иван;
<LI>Петр;
<LI>Никита
</UL>
Нумерованные списки: <OL> ... </OL>
Нумерованные списки устроены точно так же, как ненумерованные, только вместо символов, выделяющих новый элемент, используются цифры.
<OL>
<LI>Иван;
<LI>Петр;
<LI>Никита
</OL>
определяет список:
-
Иван;
-
Петр;
-
Никита
Списки определений: <DL> ... </DL>
Вместо меток <LI> в списках определений используются метки <DT> (от английского definition term — определяемый термин) и <DD> (от английского definition definition — определение определения).
<DL>
<DT>HTML
<DD>Термин означает 'язык разметки гипертекста'.
<DT>HTML-документ
<DD>Текстовый файл с расширением *.html.
</DL>
Этот фрагмент будет выведен на экран следующим образом:
HTML
Термин HTML означает ''язык разметки гипертекста'.
HTML-документ
Текстовый файл с расширением *.html.
Метки <DT> и <DD> не имеют парных закрывающих меток.
Если определяемые термины достаточно коротки, можно использовать модифицированную метку <DL COMPACT>.
<DL COMPACT>
<DT>А
<DD>Первая буква алфавита
<DT>Б
<DD>Вторая буква алфавита
<DT>В
<DD>Третья буква алфавита
</DL>
будет выведен на экран примерно так:
А Первая буква алфавита
Б Вторая буква алфавита
В Третья буква алфавита
Элемент любого списка может содержать в себе целый список любого вида.
Пример 5
<html>
<head>
<title>Пример 5</title>
</head>
<body>
<H1>HTML поддерживает несколько видов списков </H1>
<DL>
<DT>Ненумерованные списки
<DD>Элементы ненумерованного списка выделяются специальным символом и отступом слева:
<UL>
<LI>Элемент 1
<LI>Элемент 2
<LI>Элемент 3
</UL>
<DT>Нумерованные списки
<DD>Элементы нумерованного списка выделяются
отступом слева, а также нумерацией:
<OL>
<LI>Элемент 1
<LI>Элемент 2
<LI>Элемент 3
</OL>
<DT>Списки определений
<DD>Этот вид списков чуть сложнее, чем два предыдущих, но и выглядит более эффектно.
<P>Помните, что списки можно встраивать один в другой. </P>
<P>Обратите внимание, что внутри элемента списка может находиться несколько абзацев. </P>
</DL>
</body>
</html>