Учебник по HTML (HTML Уроки)

Главная » Мастерская » Статьи » УЧЕБНИК (HTML Уроки)

Учебник по HTML (HTML Уроки) - Урок 2

Для подчеркивания выполняющихся действий мы будем писать только то, что находится в пределах меток <BODY> . Мы будем опускать метки <HTML>, <HEAD> и <TITLE>. Само собой разумеется, Вы сохраняйте их в вашем документе.

<BODY> <BODY>

Наберите что-то, действительно свежее.

<BODY> Something really cool <BODY>

Something really cool

Всякий раз, когда Вы делаете изменения в вашем документе, обязательно сохраняйте его, а затем нажимайте кнопку Reload на панели вашего браузера. В некоторых случаях, нажатие только кнопки Reload не вызывает действий ... в таком случае нажмите SHIFT + Reload.

Первое дело, которую мы собираемся изучить - как изменить цвет фона. Мы думаем, вы согласитесь, что серый фон довольно ущербный.

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Something really cool

FFFFFF - Компьютерный код для белого цвета. Есть и много других.
( броузер Netscape отображает только 216 цветов на web странице. Если Вы определяете цвет отличный от этих цветов, Netscape выберет самое близкое соответствие.)

Вы можете определять изображение для фона.

<BODY BACKGROUND="swirlies.gif"> Something really cool <BODY>

Здесь использовано фоновое изображение

Вы найдете это изображение (swirlies.gif) в папке с именем pics. Если Вы просматриваете этот фрагмент интерактивно Netscape, щелкните правой кнопкой мыши на изображении и выберите в динамическом меню Save Image As...

Возможно довольно очевидно, что изображение мозаично. Если Вы используете длинное тощее изображение, Вы можете получить эффект подобный этому ...

<BODY BACKGROUND="bluebar.gif"> Something really cool <BODY>

Здесь использовано фоновое изображение

Давайте возвратимся к простому старому белому экрану..

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Something really cool

Мы можем выделять фрагменты полужирным шрифтом.

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Something really cool

Мы сообщаем браузеру: с  начать полужирный текст и завершить его на  .

Тот же самый принцип применяется к курсиву ...

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Something really cool

...и подчеркиванию.

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Something really cool

Обратно снова к простому белому экрану.

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Something really cool

Мы можем использовать метки и в комбинации.

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Something really cool

Это - пример вложенных меток. Если Вы собираетесь использовать пары меток в комбинации (возможно Вы будете делать это редко), то для избежания путаницы браузера, они должны быть вложены без перекрытия. Позвольте проиллюстрировать ......

<THIS><THAT></THIS></THAT> Перекрывающиеся метки .... плохо
<THIS><THAT></THAT></THIS> Вложенные метки .... хорошо

Очень полезный тип текстового эффекта - шрифт символов одинаковой ширины (mono-spaced) или TeleType.

<BODY BGCOLOR="#FFFFFF"> <TT>Something really cool</TT> <BODY>

Something really cool

Каждый символ использует одинаковое горизонтальное пространство.

Это обычный тип`->`	iiiiiiiiii oooooooooo mmmmmmmmmm
`Это одноширинный тип (monospaced) ->`	`iiiiiiiiii oooooooooo mmmmmmmmmm`

Мы можем так же изменить размер шрифта... Это довольно просто!

В начале добавьте метку  ...

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Затем определите атрибут размера - SIZE.

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Something really cool

5 наиболее используемых размеров шрифтов :

крошечный	малый	регулярный	дополнительный	Большой
1	2	3	4	5

Две вещи я хотел бы обсудить теперь. Во первых <МЕТКА>сообщает браузеру что сделать .. АТРИБУТ помещается внутри <МЕТКИ> и сообщает браузеру, как сделать это.
Второе замечание о значениях по умолчанию. Поскольку Вы возможно знаете, что значение по умолчанию - это значение, которое браузер принимает, если Вы не сообщили ему другое. Хороший пример - размер шрифта. Заданный по умолчанию размер шрифта 3. Если Вы не сообщаете ничего, шрифт будет размером 3.

Размер транслируется в 3 для наших целей и цвет черный. Теперь с Netscape 3.0 мы можем определять другие имена шрифтов, отличные от значения по умолчанию. Например ARIAL и COMIC SANS.

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Something really cool

Шрифт будет отображаться только в том случае, если шрифт вашей программы просмотра установлен на компьютере пользователя. Позвольте повторить ... Если человек, рассматривающий страницу на компьютере, на котором не установлен шрифт, определенный Вами, тогда он будет видеть только заданный по умолчанию шрифт. Так будьте очень благоразумны в использовании шрифтов. Arial и Comic Sans MS довольно широко распространены с Windows.

Но Вы можете несколько себя застраховать, определяя более чем один шрифт. Только делайте так ... Hidee Ho.
Браузер ищет вначале ARIAL. Если находит его, то использует его. Если нет, то ищет HELVETICA. Если не может найти и этот шрифт, то ищет LUCIDA SANS. И если не может найти и этот шрифт, то использует заданный по умолчанию шрифт.

Теперь самое хорошее время, чтобы сказать немного о синтаксисе. Обратите внимание, здесь и там мы используем кавычки, они важны. Вы понятия не имеете, сколько раз Вы будете делать страницу и она будет вся искажена ... Все искажения из-за отсутствия одной кавычки или помещения не на то место маркера кавычки или отсутствия пробела. Когда-нибудь мы уйдем от этого вида кодирования, но пока мы должны быть внимательными. Другое дело - использование ЗАГЛАВНЫХ БУКВ для большинства меток. Это - только личное предпочтение. Мы полагаем, что метки выделяются больше при использовании всех заглавных букв. Вы могли бы точно также использовать  вместо . Вы даже можете использовать .

Продолжим

Вы можете изменять цвет шрифта, если находите это приятным.

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Something really cool

Мы можем, конечно использовать больше чем один АТРИБУТ в <МЕТКЕ> ......

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Something really cool

Добавим еще!

<BODY BGCOLOR="#FFFFFF"> Something really cool <BODY>

Something really cool

Заметим еще раз, что многократные метки должны быть вложены.

<TAG3><TAG2><TAG1>Hooha!</TAG1></TAG2></TAG3>

Не имеет значение, какая метка является первой. Если Вы хотите сделать что-то красным и полужирным, то Вы должны сделать одно и потом другое. Вы можете размещать метки в любом порядке, каком хотите. Типа ....

<TAG2><TAG1><TAG3>Hooha!</TAG3></TAG1></TAG2>

Самый быстрый способ запутать браузер, не говоря уже о вас, состоит в наложении меток ...

<TAG3><TAG2><TAG1>Hooha!</TAG3></TAG1></TAG2>

(Не нужно придумывать способ объяснить это, просто использование примеров все прояснит.)

Еще одна вещь и мы должны завершить этот урок. Браузер имеет заданные по умолчанию параметры настройки для цвета текста, цвета связи, цвета активной связи и цвета посещенной связи. Значения по умолчанию - ...

Текст - черный
Связь - синий
Активная связь - красный
Посещенная связь - фиолетовый

Вы можете изменять их, если Вам необходимо.
Вы можете изменять эти значения по умолчанию для всего документа в метке <BODY>.

<BODY BGCOLOR="#00000" TEXT="#FFFF00" LINK="#FF0000" VLINK="#800000" ALINK="#008000"> Something really cool <BODY>

Something really cool

I know that we have not gotten into how to make links, so that information is not shown above (why muddy the water?) This is simply to show you how to make the color changes when you do learn how to make links.
    You can see that the background is now black and the text is now yellow.
    Links are now red
    Visited links are now dark red
    And active links are green.

Вы теперь знаете почти все, что необходимо делать с текстом в вашем документе. Вы можете теперь делать Большие красные символы или малые полужирные символы, Вы можете использовать другие Шрифты, или моноширинные шрифты.
Вы можете сделать и так rollercoaster!

Кодирование для roller coaster здесь, если Вы хотите видеть его.

[назад] [дальше]