- •Создание html-документов.
- •Заполнение фона.
- •Заголовок документа.
- •Присвоение имени документу.
- •Настрока заголовка.
- •Другие элементы заголовка.
- •Комментарии в html-документах.
- •Элемент address.
- •Использование цветов в документе.
- •Определение цветов.
- •Атрибуты для определения цветов в документе.
- •Создание шаблона документа.
- •Разбиение текста на абзацы.
- •Разрыв строк.
- •Структурирование текста.
- •Добавление заголовков.
- •Добавление горизонтальных линий.
- •Предварительное форматирование текста.
- •Советы по макетированию страниц.
- •Специализированный шаблон.
- •Форматирование символов.
- •Логическое форатирование.
- •Элементы физического форматирования.
- •Шрифты.
- •Атрибут size.
- •Атрибут color
- •Советы по форматированию текста.
- •Зачем нужна графика.
- •Основные принципы.
- •Что нужно знать при использовании графический изображений.
- •Авторские права.
- •Могут ли возникнуть проблемы из-за порнографических изображений?
- •Выбор формата графического файла.
- •Потеря информации.
- •Поддержка броузерами.
- •Добавление изображений в документ.
- •Выравнивание текста с изображением в строке.
- •Расположение текста на web-странице.
- •Указание браузеру размеров изображения.
- •Уменьшение размеров изображения.
- •Увеличение размеров изображения.
- •Создание альтернативного текста.
- •Рамка вокруг изображения.
- •Свободное пространство вокруг изображения.
- •Использование изображения в качестве ссылки.
Добавление горизонтальных линий.
Другой способ выделения смысловых фрагментов в документе заключается в использовании горизонтальных линий. Они отчетливо показывают границы между разделами, что особенно важно для выделения различных частей документа. Многие броузеры используют прерывистую линию, которая придает четкий вид документу и зрительно увеличивает глубину.
Горизонтальную линию можно создать с помощью элемента <HR>. Этот дескриптор рисует затененную горизонтальную линию вдоль экрана броузера. Дескриптор <HR> не является контейнером и не требует закрывающего дескриптора. До и после горизонтальной линии применяется обязательное разделение абзаца.
АТРИБУТЫ ДЕСКРИПТОРА <HR> | |
Атрибут |
Назначение |
align |
С помощью этого атрибута можно задать выравнивание по левому краю (left), по правому краю (right) или по центру (center) |
width |
Длину линии можно указать в пикселях или в процентном отношении к ширине окна броузера. Если используются проценты, добавьте знак процента к числу. |
size |
Высота линии в пикселях.noshade если имеется этот атрибут, то броузер не использует эффект трехмерности |
color |
Для указания цвета разделительной линии можно использовать шестнадцатеричное значение RGB или стандартное название цвета. |
СОВЕТ: В документах, созданных с помощью первых версий HTML, для более четкого и очевидного разбиения текста часто использовались графические изображения. Они, конечно, были не видны при отключенной загрузке изображения в броузере. Но даже если броузер за изображения, сложность состояла в том, что линия находилась в другом файле, который нужно было скопировать и сохранить. Новые атрибуты дескриптора <hr> открывают широкие возможности при создании документов и при этом не усложняют их.
Горизонтальные линии следует использовать в тех случаях, когда требуется жесткое разделение текста. Основные принципы использования линий заключаются в том, что они никогда не должны располагаться между заголовком и последующим текстом. Их также не следует использовать для создания пустот в документе. Пустые места, не заполненные текстом, играют важную роль в оформлении страниц. Конечно, излишек пустых мест на страницах портит общий вид документа; однако если свободного места совсем нет, то страницы выглядят переполненными.
Предварительное форматирование текста.
Обязательно ли нужно использовать элементы разрыва абзацев и строк для форматирования текста HTML? Вовсе нет: в HTML имеется контейнер, в который можно поместить предварительно отформатированный текст. Это дает автору гораздо больше возможностей управлять отображением документа. Недостаток этого способа заключается в потере гибкости.
Из всех дескрипторов предварительного форматирования наиболее эффективным и часто используемым является контейнерный <PRE>. Текст в контейнере <PRE> обычно имеет произвольную форму и пустые строки, которые служат для разрыва текста. Внутри этого контейнера можно также использовать дескрипторы разрыва строк и абзацев. Это позволяет создавать такие элементы, как таблицы и ровные колонки текста. Кроме того, элемент <PRE> часто используется для отображения больших блоков программного кода (на языке С, C++ и других), которые было бы сложно прочесть, если бы броузер переформатировал их.
Внутри контейнера <PRE> можно использовать различные элементы физического и логического форматирования текста. Например, вы можете создать таблицы, которые содержат жирные заголовки или курсив. Однако использование в этом контейнере таких элементов форматирования абзаца, как <Address> или элементы заголовка, не допускается. В контейнер <PRE> можно помещать и элементы привязки.
Основной недостаток контейнера <PRE> в том, что находящийся внутри него текст всегда отображается в броузере читателя моноширинным шрифтом. Это приводит к тому, что длинные фрагменты текста зрительно сливаются.
Вы можете использовать текстовый редактор для выравнивания колонок перед добавлением дескрипторов форматирования знаков.
СОВЕТ: Если вы не преобразуете существующие документы, то таблицы HTML выглядят намного привлекательнее тех, которые созданы с помощью дескриптора <PRE>.
Знаки табуляции перемещают курсор на следующую позицию, кратную восьми. Спецификация HTML рекомендует, чтобы знаки табуляции не использовались в предварительно отформатированном тексте, поскольку эти знаки обрабатываются различными броузерами по-разному. Для выравнивания колонок в этом случае следует использовать пробелы.
Имеются и другие контейнеры для предварительного форматирования, однако они объявлены вышедшими из употребления. Элементы <XMP> и <LISTING> позволяют создавать заранее размеченный текст. Недостаток этих контейнеров состоит в том, что внутри них не разрешается использование других элементов HTML. Броузеры не распознают другие дескрипторы разметки внутри этих элементов, кроме закрывающего дескриптора. К сожалению, многие броузеры не всегда точно выполняют это правило, и результаты могут быть самыми непредсказуемыми.
Различие между этими элементами заключается в том, что текст <XMP> должен воспроизводиться шрифтом такого размера, который позволяет разместить не менее 80 знаков в строке, а для элемента <LISTING> требуется шрифт, который позволяет разместить 132 знака.
Не следует использовать элементы <XMP> и <LISTING> без особой необходимости. Поскольку они объявлены вышедшими из употребления, броузеры могут не поддерживать их. Чтобы быть уверенным в том, что именно увидят ваши читатели, используйте вместо них элемент <PRE>.
НА ЗАМЕТКУ: Если вы хотите представить код HTML в виде предварительно отформатированного текста или использовать символы < или >, следует использовать заменяющие их коды < и >, например, таким образом: &itPRE>.
Декриптор <DIV>.
Контейнер раздела <div></div> можно использовать для выравнивания целого блока элементов страницы. Этот дескриптор поддерживает атрибут align, поэтому с его помощью можно, например, выровнять по центру блок текста и графики, как в следующем примере:
Обратите внимание, что все элементы, расположенные между дескрипторами <DIV> и </DIV>, выравниваются в соответствии тем, что указано в дескрипторе <div> (за исключением элементов, для которых указано другое выравнивание). Атрибут align, как и в других случаях, может иметь значения left (По левому краю), center (По центру) или right (По правому краю).
С помощью дескриптора <DIV> можно также использовать различные стили строки для определения стиля целого блока в документе HTML. Это возможно благодаря принципу наследования. Например, если вы хотите изменить цвет текста для целого блока дескрипторов на синий, то можете поместить эти дескрипторы в контейнер div и в стиле дескриптора <DIV> определить синий цвет текста. Это выглядит примерно так:
Дескриптор <DIV> является важной частью макетирования страницы с использованием каскадных листов стилей.