Билет_полн_текст

2.Приёмы создания сайта. Язык разметки гипертекста. Оформление текста.

Как известно, основное наполнение Web-страниц — это все-таки текст. Поэтому неудивительно, что в HTML введено столько различных средств управления отображения текста. На самом деле, для того, чтобы в окне просмотра браузера отобразить текстовую строку никаких тегов применять не требуется. Достаточно просто написать сам текст. Но когда нужно уже разбить его хотя бы на абзацы, вот тут надо пользоваться тегами.

В начале каждого абзаца ставится тег <р>, а в конце -, закрывающий тег </р>. При этом, тег, естественно, обладает некоторыми параметрами.

В HTML термин "выравнивание" относят как к горизонтальному, так и к вертикальному позиционированию элемента. Но в случае с абзацами текста имеет смысл говорить только о горизонтальном выравнивании или, как его еще называют, "выключке".

Выключка позволяет прижимать абзац к левому или правому краю окна просмотра браузера, центрировать его или растягивать слова таким образом, чтобы текст равномерно занимал всю ширину отведенного ему места. Для этих целей используются значения left, right, center и justify, соответственно. Рассмотрим их применение на примере еще одного HTML-документа.

Листинг 1.3

<html> <head> <title> Горизонтальное выравнивание a6зaцeв</title> </head> <body> Aбзац, прижатый к левому краю</р> <р align="right">Aбзац, прижатый к лравому краю</р> <р align="center">Центрированный абзац</р> Aбзац, растянутый по ширине</р> </body> </html>

Иногда для того, чтобы сильнее отделить один абзац от другого, создатели Web-страниц пытаются использовать пустые абзацы, т. е. между стартовым и конечным тегом абзаца ничего нет. Согласно спецификациям, браузеры должны просто игнорировать подобные конструкции. Поэтому для разделения абзацев или принудительного обрыва строки внутри одного абзаца следует использовать тег  . Это директивный тег. Он просто обозначает то место, где надо перенести отображение на другую строку. Пример использования этого тега для достижения обеих этих целей показан на примере HTML-документа, чей код приведен в листинге 1.4.

Листинг 1.4

<html>. <head> <title> Принудительные разрывы cтрок</title> </head> <body> <р>Aбзац, который мы Принудительно разорвали</р> <р>Следующий абзац</р> <р>Абзац после принудительного разрыва</р> </body> </html>

Тег   помимо всеобщих параметров идентификации обладает еще параметром clear, который применяется для более точного выравнивания текста, когда тот обтекает какой-либо объект, например, графическое изображение, внедренное в состав Web-страницы. В качестве значения этого параметра может использоваться одно из четырех заранее предопределенных ключевых слов: none, left, right, all. Значение none используется по умолчанию и указывает, что следующая строка начнется с того места, где она начиналась бы и без использования данного параметра, в обычных условиях. Значение left говорит о том, что следующая строка начнется у левого поля объекта, обтекаемого текстом. Если же необходимо использовать правое поле для этих целей, то следует воспользоваться значением right. А значение all указывает браузеру, что воспользоваться можно как левым, так и правым полем объекта, лишь бы текст был максимально компактно отображен.

Теперь перейдем к рассмотрению шрифтового оформления текста. В любом месте абзаца мы можем использовать тег  с некоторым набором параметров, которые и будут определять внешний вид шрифта, который будет применяться для отображения текста, находящегося после этого тега. Прекращение действия этого тега осуществляется при помощи его закрывающей пары .

Тег  обладает следующими, присущими именно ему параметрами: size, использующийся для указания размера применяемого шрифта, color - для установки цвета символов шрифта, и face, указывающий, какой именно шрифт будет применяться для отображения текста. Разберем эти параметры. Как мы только что говорили, параметр size применяется для указания размера символов используемого шрифта. В качестве значений этого параметра используются цифры от единицы до семи. Они обозначают некий относительный размер символов. Дело в том, что в HTML нельзя установить абсолютный размер символов в пунктах, как мы это привыкли делать в обычных офисных приложениях. Пользователь будет просматривать Web-страницу на своем компьютере, и нам заранее неизвестно, какие шрифты могут быть у него установлены, и какие их размеры доступны. Поэтому мы можем лишь указать относительный размер шрифта, а браузер пользователя сам подберет максимально подходящий размер. Также в качестве значения параметра size мы можем указывать и изменение размера шрифта. Например, для того, чтобы увеличить размер шрифта на один уровень, следует использовать следующую конструкцию:

А для уменьшения размера символов на два уровня, применяется следующий код:

Однако для использования подобных конструкций необходимо отталкиваться от некоего базового размера. Для установки такого размера применяется тег <basefont> с все тем же параметром size. Если же этот тег не использовать, то в качестве базового размера символов будет применяться третий уровень. Приведем пример использования этих тегов.

Листинг 1.5

<html> <head> <title> Размер сиволов</tit1е> </head> <body> <p><font sizе=*7">Седьмой paзмep</font></p> <font sizе="6">Шестой paзмep</font></p> <font sizе="5">Пятый paзмep</font></p> <font sizе="4">Четвертый paзмep</font></p> <font sizе="3">Третий paзмep</font></p> <font sizе="2">Второй paзмep</font></p> <font size="l">Первый paзмep</font></p> <basefont size=2><font zise="+2">Смещение

рaзмepa </body> </html>

Мы рассмотрели применение только одного атрибута тега . На очереди — процедура установки цвета символов применяемого шрифта. Мы уже знаем, что для этого применяется параметр color. О том, как именно записывать обозначение того или иного цвета мы говорили в предыдущем разделе, т. е. нам осталось всего лишь привести пример. Так, для установки зеленого цвети символов применяемого шрифта, следует использовать следующую конструкцию:

А последний рассматриваемый нами параметр face позволяет устанавливать вид применяемого шрифта, т. е. мы можем указать, что текст следует отображать, скажем, при помощи шрифта Times New Roman или Copperplate Gothic. Однако здесь следует понимать, что браузер пользователя будет отображать текст при помощи шрифтов, установленных в операционной системе удаленного пользователя, и если мы используем некий редкий шрифт для придания большей выразительности текстовому наполнению Web-страницы, то его может и не быть в системе пользователя. В этом случае браузер будет использовать свои собственные правила шрифтового оформления. В каждом браузере есть раздел настроек, в котором пользователь указывает, какие именно шрифты применять для текстового содержимого загружаемых Web-страниц. Поэтому в качестве значения параметра face применяется список из наименований шрифтов, разделенных запятой. Браузер пытается отыскать их в своей системе в том порядке, в котором они перечислены, и первый подошедший шрифт используется для отображения текста. Теперь, когда мы знаем порядок использования всех параметров тега , приведем пример их общего использования:

При помощи этого тега мы объявляем, что текст, находящийся после него, будет отображаться четвертым размером, символы будут черными, а применяться должен шрифт Courier New или, если он в системе не установлен, Arial Black. Но при создании обычных текстовых документов мы не удовлетворяемся одним указанием размера, цвета и вида шрифта. Есть ведь еще и различные начертания одного шрифта. Мы можем делать символы курсивными, полужирными, подчеркнутыми и перечеркнутыми. HTML также предоставляет нам эти возможности. Итак, все по очереди.

Тег  с закрывающей парой  создает полужирное начертание символов выбранного шрифта.

Теги  и  обрамляют курсивные символы.

Тег  и  заставляют браузер подчеркивать текст, расположенный между ними

Тег <strike> со своей закрывающей парой </strike> создают перечеркнутый текст.

Теги <tt> и </tt> обрамляют символы, которые браузер отображает моноширинным шрифтом.

Теги  и  указывают, что текст, заключенный между ними, необходимо отображать шрифтом уменьшенного размера.

Теги <big> и </big>, наоборот увеличивают размер символов, находящихся между ними.

Естественно, без примера нам никак не обойтись.

Листинг 1.6

<html> <head> <title> Начертания cимволов</title> </head> <body> Текст бывает полужирным или курсивным А может быть одновременно и полужирным и курсивным</р> <р>Бывает подчеркнутым и <strike>nepeчepкнутым</strike>. <Р>или <tt>моноширинным</tt> . <р>Мы можем <big>увеличивать</big> и уменьшать размер символов.</р> </body> </html>

Как видно из примера, мы можем сочетать различные начертаний друг с другом. Но следует быть аккуратным в порядке расстановки тегов. Открывающие и закрывающие теги должны оба вкладываться как в футляр в другие теги, которые были применены ранее. Пример этого можно увидеть в десятой строке листинга. А то, как выглядит данный HTML-документ при просмотре его с помощью браузера, показано на рис. 1.5. Мы рассмотрели способы, при помощи которых задаются различные параметры отображения текста. Однако в HTML предусмотрено несколько базовых способов отображения текста, которые не обязательно задавать целым набором тегов. Для них выделены собственные теги, т. е. определены некоторые категории текста, которые отображаются заранее предопределенным способом. Все эти категории чаще всего применяются в научной и компьютерной отрасли. Перечислим их.

Выделение термина в тексте производится при помощи пары тегов <еm> и </еm>.

"Усиленное" выделение, призванное еще больше привлекать внимание, создается при помощи тега  и его закрывающего близнеца .

При помощи тегов <cite> и </cite> указывается, что текст, расположенный между ними, является цитатой.

Определение некоего термина выделяется при помощи тегов <dfn> и </dfn>.

Пара тегов <code> и </code> применяется для выделения исходного кода на каком-либо языке программирования.

Текстовая информация, выводимая программой, оформляется при помощи тегов <samp> и </samp>.

Текст, вводимый пользователем, обозначается тегами <kbd> и </kbd>. Переменные в исходном коде программ обозначаются при помощи пары тегов <var> и </var>.

Теги <abbr> и </abbr> выделяют аббревиатуры.

А устоявшиеся буквосочетания, не являющиеся аббревиатурами, т. е. акронимы, выделяются тегами <acronym> и </acronym>.

Билет №18

Содержание