- •Учебник по html
- •2. Текстовый редактор - блокнот. Входит в поставку Windows
- •Оглавление Урок 1. Структура html-документа и первый html-документ
- •Урок 2. Изображения в html-документе
- •Урок 3. Гипертекст.
- •Урок 4. Описание абзаца
- •Урок 5. Списки
- •Урок 6. Таблицы
- •Урок 7. Работа с фреймами (frames)
- •Урок 8. Создание мета-тегов
- •Урок 9. Добавляем звук и видео на страничку
- •Урок 10. Ссылка на Email
Урок 4. Описание абзаца
Непарные теги имеют следующий вид: <тег> Опишем некоторые непарные теги <BR> Этот тег используется, если необходимо перейти на новую строку, не прерывая абзаца. Ниже приведен текст HTML-документа содержащий тег <BR>. <html> <head> <title>Третий HTML-документ</title> </head> <body> <H1 ALIGN=CENTER>Ваше название HTML-документа</H1> <P ALIGN=center>Это простейший пример выравнивания HTML-документа.<br>Это простейший пример выравнивания HTML-документа.<br>Это простейший пример выравнивания HTML-документа.</P> </body> </html>
Комментарии Броузеры игнорируют любой текст, помещенный между <!-- и -->. Это удобно для размещения комментариев. <!-- комментарий --> Форматирование шрифта Под форматированием шрифта принято понимать прямое указание броузеру на модификацию текущего шрифта. Например, все, что находится между тегами <B> и </B>, будет написано жирным шрифтом. Текст между тегами <I> и </I> будет написан наклонным шрифтом. Текст между тегами <ТТ> и </ТТ> будет написан шрифтом, имитирующим пишущую машинку, то есть имеющим фиксированную ширину символа. Пример 4. <html> <head> <title>Четвертый HTML-документ</title> </head> <body> <H1 ALIGN=CENTER>Ваше название <B>HTML-документа</B></H1> <P ALIGN=center><I>Это простейший пример наклонного шрифта.</I><br> Это простейший пример обычного шрифта.<br> <TT>Это простейший пример печатного шрифта.</TT> <B>Это простейший пример жирного шрифта.</B></P> </body> </html>
Форматированный текст: <PRE> ... </PRE> В самом начале мы говорили о том, что броузеры игнорируют множественные пробелы и символы конца строки. Из этого правила, однако, есть исключение. Текст, заключенный между тегами <PRE> и </PRE> выводится броузером на экран как есть, со всеми пробелами, символами табуляции и конца строки. Это очень удобно при создании красной строки перед началом абзаца. Текст с отступом: <BLOCKQUOTE> ... </BLOCKQUOTE> Текст, заключенный между тегами <BLOCKQUOTE> и </BLOCKQUOTE>, выводится броузером на экран с увеличенным левым полем.
Урок 5. Списки
HTML позволяет определять внешний вид целых абзацев текста. Абзацы можно организовывать в списки. Ненумерованные списки: <UL> ... </UL> Текст, расположенный между тегами <UL> и </UL>, воспринимается как ненумерованный список. Каждый новый элемент списка следует начинать с тега <LI>. Например, чтобы создать вот такой список:
один
два;
три
необходим вот такой HTML-текст:
<UL> <LI>один <LI>два; <LI>три </UL>
Обратите внимание: у тега <LI> нет парного закрывающего тега. Нумерованные списки: <OL> ... </OL> Нумерованные списки устроены точно так же, как ненумерованные, только вместо символов, выделяющих новый элемент, используются цифры. Если слегка модифицировать наш предыдущий пример:
<OL> <LI>один <LI>два; <LI>три </OL>
получится вот такой список:
один
два;
три
Списки определений: <DL> ... </DL> Список определений отличается от других видов списков. Вместо тегов <LI> в списках определений используются теги <DT> и <DD>. Разберем это на примере.
Допустим, у нас имеется следующий фрагмент HTML-текста: <DL> <DT>first <DD>текст первый - весь этот текст иеет отступ слева, это работа списков определений <DT>second <DD>текст второй ... </DL> Этот фрагмент будет выведен на экран следующим образом: first
текст первый - весь этот текст иеет отступ слева, это работа списков определений
second
текст второй ...
Обратите внимание: точно так же, как теги <LI>, теги <DT> и <DD> не имеют парных закрывающих тегов. Вложенные списки Списки можно вкладывать друг в друга. То есть список можно вложить в элемент другого списка. Однако злоупотреблять вложенностью не стоит. Соберем все, что мы узнали о списках в пример 5: <html> <head> <title>Пятый HTML-документ</title> </head> <body> <H1 ALIGN=CENTER>Списки в HTML</H1> <DL> <p>Ненумерованные списки</p> <UL> <LI>один <LI>два; <LI>три </UL> <p>Нумерованные списки</p> <OL> <LI>один <LI>два; <LI>три </OL> <DT>Списки определений <DD><p>Первый абзац<br> весь этот текст иеет отступ слева, это работа списков определений</p> <p>Второй абзац<br> весь этот текст иеет отступ слева, это работа списков определений</p> </DL> </body> </html>