- •От автора
- •0. Самые начальные сведения Гипертекст? html?
- •Что понадобится для освоения html?
- •Необходимое отступление о редакторах html
- •1. Простейший документ в сети Документ такой красивый – интересно, что внутри
- •Обязательные теги
- •2. Абзац!
- •Непарные метки
- •Комментарии
- •Форматирование шрифта
- •Физические стили
- •Логические стили
- •3. Целые списки из абзацев, или как нам организовать текст
- •Вложенные списки
- •4. In the Outside. Гиперсвязи Связывание
- •Изображения в html-документе
- •5. Бантики в заголовках или как "я раскрашу целый свет..." Цветовая гамма Вашего документа
- •Что в хедере тебе моем..?
- •6. Страсти по табулированию
- •Внутренняя жизнь таблиц
- •"Мы с Тамарой ходим парой" или параллельные тексты
- •Полные чисел таблицы
- •Ячейка, которая требует большего
- •Играем во вложенность
- •7. Сплошной формАлизм
- •Анатомия формы
- •Форменные кнопки
- •Начинаем собирать данные
- •Форму – почтой
- •8. Единственный практический вопрос
- •Правила хорошего тона при разработке html-документов
- •Используйте продуманную иерархию заголовков
- •Следите за вложенностью меток
- •... И затащить на него посетителей
- •Оглавление
- •65 Руководство Web-дизайнера
Вложенные списки
Элемент любого списка может содержать в себе целый список любого вида. Число уровней вложенности в принципе не ограничено, однако злоупотреблять вложенными списками все же не следует. Обычно достаточно двух-трех уровней вложенности; большее их число препятствует пониманию логической структуры документа.
Вложенные списки очень удобны при подготовке разного рода планов и оглавлений.
Наши знания о списках можно вкратце свести в пример 6:
<html><head><title>Пример Списков</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>
Форматированный текст: <PRE> ... </PRE>
В самом начале мы говорили о том, что браузеры игнорируют множественные пробелы и символы конца строки. Из этого правила, однако, есть одно исключение.
Текст, заключенный между метками <PRE> и </PRE> (от английского preformatted – предварительно форматированный), выводится браузером на экран как есть – со всеми пробелами, символами табуляции и конца строки. Это очень удобно при создании простых таблиц. Кроме того режим вывода преформатированного текста удобен при оформлении простых текстов, в частности электронных писем, в виде Web-страниц; аналогичным образом может быть оформлен текстовый вывод на экран компьютера. Размещение текста при этом определяется не браузером, а автором текста.
При выводе текст отображается шрифтом одного размера, т.е. моноширинным шрифтом типа Courier New, в котором все символы занимают один и тот же размер по горизонтали. Использование пробелов и переводов строк точно соответствует содержимому в пределах элемента PRE. Особо следует сказать о символе табуляции. Он может присутствовать в тексте, но корректное отображение его действия не гарантируется. Обычно символ табуляции вызывает пропуск стольких знакомест, чтобы последующий текст располагался на позиции строки, кратной 8. Но многие браузеры просто представляют табулятор как простой одиночный пробел.
У тега <PRE> возможна опция WIDTH, по стандарту задающая ширину предварительно отформатированного текста в символах; значение WIDTH должно быть равно или больше, чем длина самой длинной строки. В принципе, атрибут WIDTH должен обеспечивать браузер информацией, чтобы тот выбрал шрифт подходящего размера и/или скорректировал отступы для представления текста в требуемом виде. Но обычно браузеры этого не делают и используют стандартно установленный размер для моноширинных шрифтов; если при этом текст оказывается шире окна просмотра, в окне возникает горизонтальная полоса скроллинга. Ниже следуют два примера.
<P>Набор стандартных ASCII символов:</P>
<PRE>
! " # $ % & ' () * +, -. /
0 1 2 3 4 5 6 7 8 9 : ; < = > ?
@ A B C D E F G H I J K L M N O
P Q R S T U V W X Y Z [ \ ] ^ _
` a b c d e f g h i j k l m n o
p q r s t u v w x y z { | } ~
</PRE>
В следующем примере выводится по десять чисел в строке, каждое из которых занимает по 10 знакомест; числа были сгенерированы некоторой программой числовых расчетов. В том случае, если при данном окне браузера показать полностью всю строку не удастся, текст может быть свернут, либо браузер создаст горизонтальную полосу скроллинга.
<PRE WIDTH=100>
0.5138707 0.1757256 0.3086337 0.5345317 0.9476302 0.1717277 0.7022309 0.2264168 0.4947661 0.1246986
0.0838954 0.3896298 0.2772301 0.3680532 0.9834590 0.5353862 0.7656789 0.6464736 0.7671438 0.7802362
0.8229621 0.1519211 0.6254769 0.3146764 0.3469039 0.9172033 0.5197607 0.4011658 0.6067690 0.7854244
</PRE>
Текст с отступом: <BLOCKQUOTE> ... </BLOCKQUOTE>
Текст, заключенный между метками <BLOCKQUOTE> и </BLOCKQUOTE>, считается блоком цитирования и обычно выводится браузером на экран с увеличенным левым (а иногда и правым) полем.
Цитирование – это точное копирование чьих-то слов. Если Вы излагаете чью-то речь собственными словами – это уже не цитирование, и должно быть представлено как простой текст (без какой-либо специальной разметки).
BLOCKQUOTE обычно используется для относительно длинных цитат. Что касается коротких цитат, их лучше представлять используя разметку текстового уровня. В особых случаях Вы можете использовать CITE, однако лучше обратиться к физическому форматированию, например к использованию курсива или кавычек – согласно Вашим представлениям и требованиям языка. Если важно, чтобы текст выводился так, как он написан (с разделением на строки и использованием знаков пробелов и табуляции), можно использовать тег <PRE>. Не используйте BLOCKQUOTE, чтобы получить отступы. Броузер может и не показывать их при представлении текста.
Хорошим тоном считается указывать источник цитирования; иногда это даже требуется законом (копирайт). Поэтому, если это возможно, обеспечьте связь к источнику документа на Web в добавление к спецификации источника в тексте.
При цитировании Вам может понадобиться удалить некоторые слова из содержимого цитаты, тогда Вы должны четко обозначить опущенное (например обозначив удаленный текст нотацией вида –.....– наиболее распространенный способ сделать это). Совершенно неуместно в таких случаях избирательно приводить чьи-то цитаты, так, что кому-то может показаться, что сказано нечто совершенно отличное от того, что в действительности имелось в виду, может быть даже совсем противоположное. Когда Вам требуется добавить к цитируемому тексту разъясняющие слова в качестве пояснений, наиболее применимо добавление таких разъяснений другим шрифтом, например, курсивом. Также Вы должны четко показать, что пояснения не являются частью оригинала, и лучший способ сделать это – разместить свой текст в квадратных или круглых скобках.
<P>УСТАВ КОНФЕРЕНЦИИ SITA.BEER</P>
<BLOCKQUOTE>
Телеконференция sita.beer создана по пьянке почтмейстером
узла SitaNet Александром Еременко для обсуждения вопроса о том,
как они с экс-почтмейстером экс-узла complua вчера эдорово
надрались. ..... Официальный язык конференции - заплетающийся.
[Насколько можно судить по статьям – это обязательное требование - А.Л.]
Конференция является пост-модерируемой, то есть все постинги
помещаются в нее без предварительной проверки, однако модератор
может с похмелья понасылать Cancel на все статьи и вообще
чего только с похмелья не придумаешь :(
</BLOCKQUOTE>