Главная » Java, Web » Кратко о HTML

0

Наиболее распространенное применение апплетов — использование их в HTML-страницах. HTML-страница — это файл, содержащий в себе код, созданный с использованием языка HTML, HyperText Markup Language (язык разметки гипертекста). При помощи этого языка описывается содержимое Web-страниц, которое загружается в клиентскую программу-браузер. Сам по себе HTML-код выглядит совсем не так, как будет представлена страница с использованием HTML-кода, загруженного в браузер. Помимо самого текста, HTML-код будет содержать инструкции, которые определят структуру текста, внешний вид страницы, динамические элементы, вставленные в страницу, рисунки и т. п. При помощи HTML в страницу могут быть вставлены и Java-апплеты.

Создать HTML-страницу можно при помощи простого текстового редактора, вводя вручную все инструции разметки. Однако существует большое количество программ, которые помогают создавать HTML-страницы без необходимости вникать в детали HTML-кода. При этом создание HTML- страницы становится столь же простым делом, как создание текстовой страницы в текстовом процессоре, например, в программе MS Word. Однако использование программ автоматического редактирования HTML-страниц не позволяет возпользоваться всеми возможностями, предоставляемыми языком HTML, к тому же динамические элементы требуют задания определенных параметров, которые необходимо указывать в контексте потока HTML-кода. Редакторы HTML-страниц порой генерируют чрезмерно причудливый HTML-код, который требует редактирования вручную. Все это говорит о том, что знание языка HTML просто необходимо.

В этом разделе мы рассмотрим основы языка HTML.

Команды языка HTML представляют собой теги. Структура тега такова:

<имя тега [модификаторы-атрибуты]>

Имя тега — это слово. Существует ограниченный набор стандартных имен тегов. Модификаторы-атрибуты — это определенные свойства, в каждом теге их может быть указано несколько или же может не быть ни одного. Для каждого тега существует свой набор атрибутов. Модификаторы имеют такой вид:

Имя_атрибута = значение

Как правило, значение заключается в кавычки. Это особенно важно в том случае, если строка значения состоит из нескольких слов. Помните, что HTML не чувствителен к регистру, то есть заглавные и строчные буквы несут один и тот же смысл. Вот пример тега: <hr> — он используется для создания горизонтальной черты-линейки, проходящей слева направо (или, если хотите, справа налево) через всю страничку. Тег <hr> может иметь несколько атрибутов, например, атрибуты width и align. Для того чтобы создать короткую линейку, расположенную по центру странички, используем следующий тег:

<HR align=center width="33%">

Здесь указана ширина линейки в процентах от ширины всей странички (рис. 1.7). Вместо относительной ширины можно задать значение ширины линейки в пикселах. Атрибут align может принимать значения center (или centre), left, right.

Рис. 1.7. Простая линейка и текст HTML

 

Рис. 1.8. Перенос строки

Рис. 1.9. Выравнивание по правой стороне

 

Рис. 1.10. Выравнивание по центру

Большинство тегов требует наличия парных им закрывающих тегов, которые выглядят так:

</имя тега>

Однако не все теги таковы, некоторые элементы не требуют использования закрывающих тегов, например (рис. 1.8):

Vadim A. Budilov<BR> OLYMP @ KED<BR> Talstrasse 3<BR> 63517 Rodenbach GERMANY<BR>

Здесь используется тег <br>, который служит для перехода на новую строку. Элементы в языке HTML описываются при помощи тегов. Каждому тегу соответствует элемент. Как правило, элемент состоит из открывающего тега, тела элемента и закрывающего тега, однако не все эти три составляющие должны обязательно присутствовать. Всегда является необходимым только открывающий тег. Тело элемента и закрывающий тег как правило также нужны, однако это относится не ко всем элементам HTML. Среди таких элементов — элемент <р>, который обозначает начало нового абзаца. После открывающего тега <р> следует тело тега (которое, однако, может оказаться и пустым), в нем записывается текст абзаца. Абзац заканчивается тегом </р>, которого, однако, может и не быть. Вместо закрывающего абзац тега можно использовать тег, открывающий новый абзац. Тег <р> может содержать атрибуты, например, атрибут выравнивания <р align=right> (рис. 1.9) или <р align= center> (рис. 1.10).

Далее будут рассмотрены очень кратко основные элементы HTML.

Общая структура HTML-документа

HTML-документ имеет стандартную структуру. Документ состоит из элемента <html>, он открывается тегом <html> и заканчивается тегом </html>. Между этими тегами располагается заголовок документа, обозначаемый при помощи тегов <head> и </head>. Основное содержание HTML-документа располагается между тегами <body> и </body> (листинг 1.9).

Листинг 1.9. Общая структура HTML-документа

<HTML> <HEAD> <TITLE>

Заголовок страницы </TITLE>

</head> <BODY>

Содержимое страницы </BODY> </html>

Тег <BODY> имеет множество атрибутов, например,

<BODY bgcolor=white>

Этот тег указывает, что цвет фона страницы будет белый. Помимо этого существуют и другие атрибуты, например, цвет текста (text), цвет ссылок (link), цвет посещенных ссылок (vlink):

<BODY bgcolor=black text=white link=blue alink=red vlink=gray>

Какие атрибуты связаны с тем или иным HTML-элементом? Ответ на этот вопрос можно найти в документации по HTML или в справках в специализированных редакторах, например, в редакторе SlickEdit.

Вот список всех атрибутов элемента <body>, определенных в HTML 4. Однако это не значит, что те или иные браузеры не могут определить и дополнительные атрибуты для элемента <body>, значительно расширив перечень используемых атрибутов. Еще раз повторим, что это лишь те атрибуты элемента <body>, которые описаны в стандарте HTML 4.

?    background = url

?    text = color

?    link = color

?    vlink = color

?    alink = color

?    id

?    class

?    lang

?    dir

?    title

?    style

?    bgcolor

?    onload

?    onunloadonclick

?    ondblclick

?    onmousedown

?    onmouseup

?    onmouseover

?    onmousemove

?    onmouseout

?    onkeypress

?    onkeydown

?    onkeyup

Существует набор стандартных названий цветов.

?    Black = #000000

?    Green = #008000

?    Silver = #C0C0C0

?    Lime = #00FF00

?    Gray = #808080

?    Olive = #808000

?    White = #FFFFFF

?    Yellow = #FFFF00

?    Maroon = #800000

?    Navy = #000080

?    Red       = #FF0000

?    Blue = #0000FF

?    Purple = #800080

?    Teal = #008080

?    Fuchsia = #FF00FF

?    Aqua = #00FFFF

Справа от названия указано соответствующее этому цвету значение в формате rrggbb. Вместо названия цвета при задании цвета можно использовать этот формат.

Заголовки и шрифты

В HTML предусмотрено несколько элементов для оформления структуры текста. Для выделения заголовков используются теги <hi>, <Н2>, …, <нб>. Они соответствуют заголовкам соответствующих уровней. Эти теги всегда должны иметь парные им закрывающие теги, такие, как </hi>. Заголовки могут быть выровнены с использованием атрибута align со значениями left, right, center. Например:

<Н1 align=center>3aronoBQK первого уровня</Н1>

Стиль текста также создается с использованием тегов. Теги <в> и </в> используются для выделения фрагмента текста полужирным шрифтом, тег <i> служит для выделения курсивом, <и> — подчеркнутый текст, <тт> — моноширинный шрифт печатной машинки, <зив> — нижний индекс, <sup> — верхний индекс, например (рис. 1.11): x<sup>2</sup> — это икс в квадрате

Рис. 1.11. Использование верхнего индекса в HTML

Более гибкое средство управления внешним видом шрифта — это теги <font>. ..</font>. Элемент <font> имеет свой набор атрибутов, определенных в стандарте HTML 4, например:

<FONT color=blue size="+3">Bonbiiioii текст синего цвета</РОШ>

Списки

Списки образуются с использованием тегов <ul> и <ol>. <ol> — это упорядоченный список, то есть нумерованный список, <ul> — это список неупорядоченный, маркированный список. Каждый элемент списка начинается с тега <li>. Список заканчивается тегом </ol> или </ul>, например:

<ul>

<LI>Isaac Asimov <LI>Ursula Leguin <LI>Greg Bear <LI>C. J. Cherryh </UL>

Ссылки

Практически все HTML-документы содержат ссылки на другие HTML- страницы и интернет-ресурсы. Ссылки создаются при помощи тега <а>, этот ярлык имеет атрибут href, значением которого указывается адрес URL (Uniform Resource Locator, универсальный адрес ресурсов), например:

<А HREF="http://www.e-olymp.com/">Haina ссьшка</А>

Рисунки

Рис. 1.12. Рисунок, отображенный при помощи HTML

Рисунки вставляются в HTML-страничку с помощью тега <img>. Этот тег не имеет парного закрывающего тега, а также нет и тела для соответствующего ему элемента. В качестве основного атрибута указывается URL картинки. Кроме того, можно задать размеры рисунка, при этом картинка будет сжата (или растянута) в соответствии с указанными размерами. Можно указать атрибуты выравнивания, альтернативный текст на тот случай, если картинка не сможет быть загружена в браузер (рис. 1.12):

<IMG SRC="figurel.gif" ALIGN=RIGHT height=150 width=100 ALT="Figure 1">

Источник: Будилов В. А. Интернет-программирование на Java. — СПб.: БХВ-Петербург, 2003. — 704 е.: ил.

По теме:

  • Комментарии