HTML: Популярный самоучитель - Александр Чиртик
Шрифт:
Интервал:
Закладка:
При создании списка ключевых слов крайне удобно использование атрибута lang для указания различных наборов ключевых слов на различных языках (и для различных языков поиска). Например, как в следующем случае:
<META name = «Keywords» lang = «ru» content = «HTML, веб-дизайн, гипертекст, сайт, сайты ...»>
<META name = "Keywords" lang = "en" content = "HTML, web-design, hypertext, site, sites ...>
Можно, конечно, задать список одним единственным тегом <META> сразу на всех нужных языках. Как удобнее – решать вам.
Теперь пришло время рассмотреть использование второй пары атрибутов: http-equiv и content. Эта пара значений, если говорить упрощенно, позволяет влиять на работу браузера. Кроме того, она может использоваться поисковыми системами. В табл. 2.2 приведены некоторые распространенные значения атрибута http-equiv и описание соответствующих им значений атрибута content.
Таблица 2.2. Значения атрибута http-equiv и соответствующие значения атрибута contentНапоследок остается только заметить, что использовать все приведенные значения атрибутов name и http-equiv необязательно. В большинстве случаев достаточно бывает ограничиться заданием ключевых слов и кодировки HTML‑документа.
2.4. Тело HTML-документа
Вся содержательная часть HTML‑документа находится в его теле (элемент BODY). Для определения этого элемента используются парные теги <BODY> и </BODY>. Теги <BODY> и </BODY> не являются обязательными, но их наличие, как и в случае тегов <HEAD> и </HEAD>, значительно улучшает наглядность структурной организации HTML‑документа и позволяет четко отделить содержимое документа от заголовка.
Все, что помещено между тегами <BODY> и </BODY>, является содержимым документа, показываемым браузером пользователю. В простейшем случае это может быть просто текст без всякого дополнительного оформления. Ниже приведен список наиболее часто используемых атрибутов элемента BODY:
• background – URI, указывающий расположение изображения для фона (обычно берется небольшое изображение, которое размножается для заполнения фона всего документа);
• bgcolor – цвет фона HTML‑документа;
• text – цвет шрифта документа;
• link – цвет непосещенных гиперссылок;
• vlink – цвет посещенных гиперссылок;
• alink – цвет гиперссылок при выборе их пользователем (при нажатии Enter произойдет переход по такой гиперссылке).
Все атрибуты, позволяющие задавать цвет (не только элемента BODY, но прочих элементов, которые будут рассмотрены далее), имеют тип %Color. Значения таких атрибутов могут задаваться шестнадцатеричными числами с символом # в начале каждого числа, например:
bgcolor = «#FF0005»
При задании цвета данным способом следует помнить, что числом задается цвет в RGB‑формате. Это значит, что первые два символа задают интенсивность красного цвета от 0 до FF (255 в десятичной системе счисления), третий и четвертый символы – интенсивность зеленого цвета, а два последних – интенсивность синего цвета. В данном примере интенсивности красного, зеленого и синего цветов равны FF, 0 и 5 соответственно.
Кроме того, атрибутам задания цвета можно присваивать предопределенные идентификаторы некоторых наиболее часто употребляемых цветов. Список этих названий и их численные значения приведены в табл. 2.3.
Таблица 2.3. Идентификаторы и значения часто используемых цветовДля закрепления всего, что было описано в этой главе, можно рассмотреть простой пример.
Данный пример базируется на уже полученных знаниях (на теги задания гиперссылок и теги <P> можете пока не обращать внимания, так как важен только цвет гиперссылок и текста) (пример 2.2).
Пример 2.2. Пример задания названия документа и параметров цвета<HTML>
<TITLE>Пример задания цветов в элементе BODY</TITLE>
<BODY
background = "2.2.html-files/back.jpg"
text = "black"
link = "#0080FF"
vlink = "blue"
alink = "navy">
Обычный неформатированный текст должен отображаться черным цветом
<P><A HREF = "ref1">Непосещенная гиперссылка (голубой цвет)</A>
<P><A HREF = "ref2">Посещенная гиперссылка (синий цвет)</A>
<P><A HREF = "ref3">Выделенная гиперссылка (темно-синий цвет)</A>
</BODY>
</HTML>
После обработки приведенного примера браузером получится документ, который показан на рис. 2.1.
Рис. 2.1. Результат обработки HTML-текста примера
В данном примере использовался неформатированный текст. Но HTML на то и HTML, чтобы всячески способствовать улучшению восприятия содержимого текста и наделять обычный текст возможностями навигации. В последующих главах будут подробно рассмотрены форматирование текста, вставка в него иллюстраций и прочие замечательные возможности HTML.
Глава 3
Текст
Как вы могли заметить, чтобы поместить простой текст на страницу, достаточно ввести его в теле документа. При этом браузер отобразит текст, используя шрифт и цвет, заданные по умолчанию для текста тела страницы.
Чтобы чтение информации, содержащейся в HTML‑документе, стало приятным занятием, применяется форматирование и разбиение документа на логически цельные части (структурирование) с визуальным отделением этих частей друг от друга. Далее будут рассмотрены основные возможности HTML, позволяющие сделать содержимое документа легко читаемым и воспринимаемым. Однако перед описанием форматирования и структурирования текста нужно рассмотреть особенности, которые необходимо учитывать при добавлении непечатных и зарезервированных для языка HTML символов в текст документа.
3.1. Особенности ввода текста
При вводе текста в документ часто возникает вопрос: как заставить браузер отобразить зарезервированные символы языка HTML (например, > или &) или символы, которые невозможно ввести с клавиатуры. Для ввода в документ таких символов в HTML предусмотрен механизм ссылок на символы. Таким образом, когда необходимо ввести в документ, например, символ &, то в текст на его место подставляется специальная последовательность – ссылка на данный символ.
Ссылки на символы могут быть представлены любым из указанных ниже способов:
• &#D; – позволяет задать символ, код которого имеет значение D (в десятичной системе счисления);
• &#xH; – позволяет задать символ, код которого имеет значение H (в шестнадцатеричной системе счисления);
• &имя_символа; – позволяет использовать именованную ссылку на символ.
Как можно увидеть, ссылка на символ в тексте HTML‑документа начинается символом & и заканчивается точкой с запятой (;). Особо стоит рассмотреть использование именованных ссылок на символы. Дело в том, что использование первых двух вариантов предполагает, что автору известны численные коды символов, которые он собирается добавить в документ. Однако согласитесь, что постоянно искать в таблицах численные коды нужных символов по меньшей мере неудобно. По этой причине в HTML предусмотрены имена для наиболее часто используемых символов. Эти имена и записываются вместо кода в тексте ссылок на символы. Имена некоторых часто используемых символов приведены в табл. 3.1. Полный список именованных ссылок на символы приведен в приложении 1.
Таблица 3.1. Имена символовВ качестве примера использования ссылок на символы в HTML‑документе можно рассмотреть следующий HTML‑код (пример 3.1).
Пример 3.1. Использование ссылок на символы<TITLE>Именованные ссылки на символы</TITLE>
<BODY text = "yellow" bgcolor = "blue">
<TITLE> Именованные ссылки на символы </
TITLE><BR>
<BODY color = " yellow "
bgcolor = " yellow " > <BR>
Текст HTML-документа <BR>
</BODY>
</BODY>
При обработке данного кода браузером Internet Explorer получится документ, который показан на рис. 3.1.
Рис. 3.1. Использование ссылок на символы
Конечно, возможности использования ссылок на символы приведенным примером не ограничены. Ссылки на символы очень часто применяются для записи математических формул. Кроме того, их можно использовать для записи текста на иностранном языке, но с использованием символов другого языка (например, для ввода символа в при использовании символов только английского языка).
3.2. Форматирование текста
Для изменения вида текста, отображаемого браузером, применяется форматирование с использованием специальных HTML‑тегов. Форматирование текста HTML‑документа сходно с форматированием в любом текстовом редакторе (например, Microsoft Word). Оно позволяет выделить цветом, начертанием, изменением шрифта некоторый текст, подчеркнуть его значимость или просто украсить.
Задание начертания текста
Задание начертания текста является, возможно, самым простым средством форматирования содержимого документа, которое доступно в HTML. Для изменения начертания текста в HTML‑код добавляются элементы, приведенные в табл. 3.2.
Таблица 3.2. Элементы задания начертания текстаДля наглядности можно рассмотреть пример HTML‑документа, в котором используются различные элементы задания начертания текста (пример 3.2).
