ќсновы €зыка HTML

—интаксис HTML-тегов. —труктура HTML-документа. –аздел HEAD и BODY.  оды HTML-символов. ‘орматирование текста: символов, абзацев. –азмещени€ рисунков, таблиц. —в€зь между HTML-документами и фрагментами документов. —интаксис атрибута и карта гиперссылок.

–убрика ѕрограммирование, компьютеры и кибернетика
¬ид реферат
язык русский
ƒата добавлени€ 14.01.2014
–азмер файла 36,5 K

ќтправить свою хорошую работу в базу знаний просто. »спользуйте форму, расположенную ниже

—туденты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.

–азмещено на http://www.allbest.ru/

ћинистерство образовани€ и науки –оссийской ‘едерации

јЌќ ¬ѕќ Ђƒальневосточный институт международных отношенийї

 афедра экономики бухгалтерского учета и прикладной информатики

—пециальность 080105. 65 Ђћирова€ экономикаї

–еферат

по дисциплине Ђ»нформатика и интернет-технологииї

на тему: Ђќсновы €зыка HTMLї

¬ыполнил: студент 3 курса

группы____________________

є з/к______________________

‘амили€___________________

»м€_______________________

ќтчество___________________

ѕроверил:

___________________________

’абаровск 2013 г.

¬ведение

»нтернет представл€ет собой всемирную сеть, объедин€ющую компьютерные сети по всему миру на базе единых стандартных соглашений (протоколов) о способах обмена информацией и единой системой адресации.

  насто€щему времени сеть »нтернет получила беспрецедентное распространение. ѕо оценкам экспертов »нтернет объедин€ет более 100 миллионов компьютеров. ”слугами »нтернет пользуетс€ свыше 300 миллионов человек в 170 странах мира.

— функциональной точки зрени€ »нтернет представл€ет собой:

?недорогое быстродействующее средство общени€ между абонентами по всему миру;

?не имеющее аналогов хранилище информации по любым област€м знаний;

?новую перспективную среду дл€ де€тельности.

¬ли€ние »нтернет распростран€етс€ не только на технологическую область компьютерных коммуникаций, оно имеет также социальную направленность и пронизывает все общество по мере того, как все более широкое распространение получают оперативные средства получени€ знаний, электронной коммерции.

—амым распространенным и востребованным сегодн€ €вл€етс€ такой сервис »нтернет, как WWW (WorldWideWeb ? всемирна€ паутина). »нформаци€ в WWW представлена в виде так называемых гипертекстовых (или, более широко, гипермедийных) документов, которые могут содержать отформатированный текст, графику, аудио- и видеофрагменты. ќсновной особенностью гипертекстовых документов €вл€етс€ наличие активных зон, чувствительных к щелчку мыши. јктивными могут быть фрагменты текста, целые изображени€ и их части; щелчок по активной зоне вызывает загрузку св€занного с этой зоной (целевого) документа.

„тобы научитьс€ размещать материалы в »нтернет, прежде всего необходимо познакомитьс€ с €зыком разметки гипертекста HTML (Hyper Text Markup Language)

1. ќсновы €зыка HTML

язык разметки гипертекстовых документов HTML представл€ет собой совокупность команд, называемых тегами (от английского tag). ¬стречающиес€ в тексте документа HTML-теги интерпретируютс€ браузером при отображении документа.

ѕросмотр HTML-документов осуществл€етс€ с помощью программ-браузеров (от английского browser), которые отображают документ в соответствии с HTML-разметкой и обеспечивают навигацию по гиперссылкам. Ќаиболее распространенными €вл€ютс€ браузеры Microsoft Internet Explorer фирмы Microsoft Corporation и Netscape Navigator фирмы Netscape Communications Corporation.

ѕоскольку HTML-документ представл€ет собой текстовый файл, его можно подготовить в простейшем текстовом редакторе, например, в блокноте (Notepad), но это очень трудоемко. „аще используют специализированные редакторы, предназначенные именно дл€ подготовки HTML-документов, которые позвол€ют вставл€ть теги с помощью кнопок панелей инструментов либо команд меню, и задавать атрибуты тегов в диалоговых окнах, например, Macromedia Dreamweaver, Microsoft Front Page, Home Site и др.

HTML-документ может быть получен преобразованием в HTML-формат, например, из формата документов пакета Microsoft Office. Ќадо отметить, что при таком преобразовании исходный текст HTML-документа получаетс€ крайне избыточным и нуждаетс€ в коррекции. «начительно эффективнее пользоватьс€ специальными HTML - редакторами.

1.1 —интаксис HTML-тегов

HTML-тег записываетс€ в угловых скобках и состоит из имени, за которым может следовать список атрибутов (дл€ большинства тегов необ€зательный). »мена и атрибуты представл€ют собой английские слова и аббревиатуры.

“еги условно можно разделить на две группы:

- парные теги (называемые также контейнерами) имеют два компонента: открывающий (начальный) и закрывающий (конечный) ; закрывающий компонент имеет то же название, но при записи перед названием ставитс€ коса€ черта (символ /). ћежду открывающим и закрывающим компонентами может располагатьс€ текст документа и другие теги. ‘рагмент документа, расположенный между открывающим и закрывающим элементом тега-контейнера форматируетс€ браузером согласно смыслу тега. Ќапример, текст, расположенный между тегами и, будет выведен полужирным начертанием (название тега - от английского bold). ѕарные теги могут быть вложены друг в друга, но не должны пересекатьс€.

- непарные теги (называемые также автономными) не имеют конечного компонента. ѕри их интерпретации в отображаемый документ вставл€етс€ тот или иной объект. Ќапример, тег <IMG SRC=Ђpict. gifї>, встречающийс€ в тексте HTML-документа, вызывает вставку графического изображени€ из файла pict. gif.

јтрибуты в списке отдел€ютс€ друг от друга одним или несколькими пробелами, либо символами табул€ции, либо символами перевода строки; последовательность записи атрибутов несущественна. ѕодавл€ющее большинство атрибутов употребл€ютс€ в виде пары название атрибута = значение атрибута. ¬ случае, когда значение атрибута представл€ет собой более чем одно слово либо одно число, его следует заключить в одинарные или двойные кавычки. ¬ закрывающих компонентах тегов атрибуты не указываютс€.

2. —труктура HTML-документа

HTML-документ заключаетс€ в теги. ћежду этими тегами располагаютс€ две секции: секци€ заголовка и секци€ тела документа. —екци€ заголовка содержит описание параметров, используемых при отображении документа, но не отражающихс€ непосредственно в окне браузера. —екци€ тела документа содержит основной текст, предназначенный дл€ отображени€ браузером, теги форматировани€, размещени€ рисунков, таблиц, гиперссылок и т. д.

HTML-код простейшего документа, пригодного дл€ размещений в »нтернет, выгл€дит так:

<TITLE> Ќаша перва€ страничка TITLE>

ƒанный код может быть набран в текстовом редакторе Ѕлокнот и сохранен как файл с расширением. htm или. html? в этом случай документ откроетс€ в браузере, установленном на вашем компьютере по умолчанию. Ѕраузер отобразит этот документ, вывед€ в своем окне строку Ђ—амый простой HTML-документї, расположенную в секции тела документа. ‘раза ЂЌаша перва€ страничкаї будет отображатьс€ в строке заголовка браузера.

2.1 –аздел HEAD

—екци€ заголовка обычно содержит теги, незаметные дл€ пользовател€, но тем не менее способные активно вли€ть не внешний вид документа.

“ег

Ќазначение

Е

ќпредел€ет им€ всего документа. »м€, как правило, отображаетс€ в заголовке окна браузера. ƒанный элемент об€зателен дл€ любого HTML-документа и может быть указан не более одного раза.

”казывает базовый адрес текущего документа (URL), который станет отправной точкой дл€ расчета относительных адресов внутри документа. Ёлемент не имеет конечного тэга. ќб€зательно присутствие хот€ бы одного из аргументов:

HREF - определ€ет базовый адрес (URL) текущего документа.

TARGET - определ€ет им€ фрейма, которое будет использоватьс€ в гиперссылках по умолчанию. Ёто может вам пригодитьс€, если вы хотите открывать все ссылки документа в другом фрейме.

<STYLE TYPE=Ђtext/cssї>

»спользуетс€ дл€ вставки в документ каскадных таблиц стилей (CSS ? Cascade Style Sheet). TYPE ? об€зательный атрибут, значением которого, как правило, €вл€етс€ Ђtext/cssї.

<ћ≈“јЕ>

Ёлемент ћ≈“ј используетс€ дл€ технического описани€ документа. — помощью этого элемента в заголовок документа внедр€етс€ дополнительна€ полезна€ информаци€, невидима€ дл€ пользовател€, но порой просто незаменима€ дл€ правильной индексации вашей страницы роботами поисковых серверов. Ёлемент не имеет конечного тега.

NAME - определ€ет им€ мета-записи. —уществует множество предопределенных имен, некоторые из которых вы можете увидеть в указанном ниже примере.

CONTENT - присваивает значение мета-записи, определенной в параметре NAME.

2.2 –аздел BODY

Ётот раздел включает в себ€ основное содержание веб-страницы ? текст документа, изображени€, таблицы и т. п. Ёлемент BODY должен встречатьс€ в документе не более одного раза и может включать следующие атрибуты:

—интаксис атрибута

Ќазначение

MARGINHEIGHT=число

ќпредел€ет ширину (в пиксел€х) верхнего и нижнего полей документа. –аботает только в браузерах Netscape

TOPMARGIN= число

ќпредел€ет ширину (в пиксел€х) верхнего и нижнего полей документа. –аботает только в браузерах Internet Explorer

MARGINWIDTH= число

ќпредел€ет ширину (в пиксел€х) левого и правого полей документа. –аботает только в браузерах Netscape

LEFTMARGIN= число

ќпредел€ет ширину (в пиксел€х) левого и правого полей документа. –аботает только в браузерах Internet Explorer

BACKGROUND= URL

ќпредел€ет изображение дл€ Ђзаливкиї фона (фонового рисунка). «начение задаетс€ в абсолютного или относительного адреса изображени€ (см. раздел –азмещение рисунков)

BGCOLOR=цвет

ќпредел€ет цвет фона документа.

MicrosoftInternetExplorerподдерживает 16 стандартных имен цветов (aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, yellow, white)

ƒругим способом €вл€етс€ использование кода цвета в виде шестиразр€дного шестнадцатеричного числа, задающее интенсивность красной (первые две цифры), зеленой (следующие две цифры) и синей (последние две цифры) составл€ющей. »нтенсивность каждой составл€ющей в шестнадцатеричной форме измен€етс€ от 00 до FF. ѕри задании цвета в качестве значени€ атрибута некоторого тега перед шестнадцатеричным числом ставитс€ символ #.

Ќапример, запись COLOR=Ђ#0000FFї означает синий цвет

Ќесмотр€ на принципиальную возможность задать миллионы цветов, надо учитывать, что браузеры отображают лишь 256 цветов, причем у каждого браузера сво€ цветова€ палитра. ¬ этой палитре браузер подберет цвет, наиболее близкий к заданному

TEXT=цвет

ќпредел€ет цвет текста в документе

LINK=цвет

ќпредел€ет цвет гиперссылок в документе

ALINK=цвет

ќпредел€ет цвет подсветки гиперссылок в момент нажати€

VLINK

ќпредел€ет цвет гиперссылок на уже просмотренные документы

2.3  оды HTML символов

ƒл€ специальных символов в HTML-стандартах предусмотрен особый способ кодировани€ (с помощью escape-последовательностей или символьных объектов), который позвол€ет примен€ть эти символы в необходимых позици€х документа, не наруша€ его структуры (это касаетс€, например, символов <, >и &). ”словное обозначение спецсимвола (escape-последовательность) начинаетс€ символом &, включает собственно им€ спецсимвола и завершаетс€ точкой с зап€той (например, Ђ у условное обозначение дл€ кавычки).  роме того, вместо имени символа можно воспользоватьс€ соответствующим ASCII-кодом (например, &#034; у дл€ кавычки).

—ледует отметить, что разными броузерами коды и имена специальных символов (escape-последовательности) могут интерпретироватьс€ несколько различным образом. Ќа вид отображаемых символов также вли€ет выбранный дл€ отображени€ шрифт и таблица символов (кодировка).

Ќазвание

—имвол

ASCII

»м€

“абул€тор

&#009;

ѕеревод строки

&#010;

¬озврат каретки

&#013;

ѕробел

&#032;

¬осклицательный знак

!

&#033;

 авычка

Ђ

&#034;

&quot;

«нак решетка

#

&#035;

ƒоллар

$

&#036;

ѕроцент

%

&#037;

јмперсанд

&

&#038;

&amp;

јпостроф

'

&#039;

—кобка лева€ кругла€

(

&#040;

—кобка права€ кругла€

)

&#041;

«вездочка

*

&#042;

ѕлюс

+

&#043;

«ап€та€

,

&#044;

ћинус

-

&#045;

“очка

.

&#046;

 осой штрих

/

&#047;

÷ифры

0-9

&#048; -&#057;

ƒвоеточие

:

&#058;

“очка с зап€той

;

&#059;

ћеньше

<

&#060;

–авно

=

&#061;

Ѕольше

>

&#062;

«нак вопроса

?

&#063;

«нак обезь€нка

@

&#064;

ѕрописные буквы

A-Z

&#065; -&#090;

—кобка квадратна€ лева€

[

&#091;

 осой штрих с наклоном вправо

\

&#092;

—кобка квадратна€ права€

]

&#093;

—тепень

^

&#094;

«нак подчеркивани€

_

&#095;

”дарение

`

&#096;

—трочные буквы

a-z

&#097; -&#122;

‘игурна€ скобка лева€

{

&#123;

¬ертикальный штрих

|

&#124;

‘игурна€ скобка права€

}

&#125;

“ильда

~

&#126;

«ап€та€

В

&#130;

‘лорин

Г

&#131;

 авычка нижн€€ права€

&; #132;

&#132;

ћноготочие

Е

&#133;

 рест

Ж

&#134;

ƒвойной крест

З

&#135;

 рышка

И

&#136;

ѕромилле

Й

&#137;

ѕараграф

К

&#138;

—имвол меньше

<

&#139;

Ѕольшое ќ≈

М

&#140;

ќдинарна€ кавычка слева

`

&#145;

ќдинарна€ кавычка справа

'

&#146;

 авычка слева

У

&#147;

 авычка справа

Ф

&#148;

 рупна€ точка

*

&#149;

 ороткий дефис

-

&#150;

ƒлинный дефис

-

&#151;

“ильда

Ш

&#152;

“орговый знак

Щ

&#153;

&reg;

Ъ

&#154;

—имвол больше

>

&#155;

ћаленькое ое

Ь

&#156;

Ѕольшой Y-умлаут

Я

&#159;

Ќеразрывный пробел

&#160;

&nbsp;

ѕеревернутый восклицательный знак

°

&#161;

&ixcl;

÷ент

Ґ

&#162;

&cent;

‘унт

£

&#163;

&pound;

¬алюта

§

&#164;

&curren;

»ена

&#165;

&yen;

ѕрерванный штрих

&#166;

&brvbar;

ѕараграф/–аздел

І

&#167;

&sect;

“очки умлаута

®

&#168;

&uml;

 опирайт

©

&#169;

&copy;

ѕор€дковое числительное женского рода

&#170;

&ordf;

‘ранцузска€ кавычка слева

Ђ

&#171;

&laquo;

Ќе/Ќет

ђ

&#172;

&not;

–азрыв в месте переноса

-

&#173;

&shy;

«арегистрированный торговый знак

Ѓ

&#174;

&reg;

Ќадчеркивание

ѓ

&#175;

&macr;

√радус

&#176;

&deg;

ѕлюс-минус

±

&#177;

&plusmn;

¬тора€ степень

&#178;

&sup2;

“реть€ степень

&#179;

&sup3;

ћаленькое а с ударением

і

&#180;

&acuate;

ћю

µ

&#181;

&micro;

ѕараграф

ґ

&#182;

&para;

—редн€€ точка

Ј

&#183;

&middot;

÷едиль

Є

&#184;

&cedil;

ѕерва€ степень

є

&#185;

&sup1;

ѕор€дковое числительное мужского рода

Ї

&#186;

&ordm;

‘ранцузска€ кавычка справа

Ђ

&#187;

&raquo;

ƒробь Љ

Љ

&#188;

&frac14;

ƒробь љ

љ

&#189;

&frac12;

ƒробь Њ

Њ

&#190;

&frac34;

ѕеревернутый вопросительный знак

њ

&#191;

&iquest;

Ѕольша€ ј с ударением

ј

&#192;

&Agrave;

Ѕольша€ ј с ударением

Ѕ

&#193;

&Aacute;

Ѕольша€ ј с крышкой

¬

&#194;

&Acirc;

Ѕольша€ ј с тильдой

&#195;

&Atilde;

Ѕольша€ ј-умлаут

ƒ

&#196;

&Auml;

Ѕольша€ ј с кружком

&#197;

&Aring;

Ѕольшое ј≈

&#198;

&AElig;

Ѕольша€ — цедил

«

&#199;

&Ccedil;

Ѕольша€ ≈ с ударением

»

&#200;

&Egrave;

Ѕольша€ ≈ с ударением

&#201;

&Eacute;

Ѕольша€ ≈ с крышкой

 

&#202;

&Ecirc;

Ѕольша€ ≈-умлаут

Ћ

&#203;

&Euml;

Ѕольша€ I с ударением

ћ

&#204;

&Igrave;

Ѕольша€ I c крышкой

ќ

&#206;

&Icirс;

Ѕольша€ I-умлаут

ѕ

&#207;

&Iuml;

3. ‘орматирование текста

3.1 ‘орматирование символов

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

ќсновным €вл€етс€ тег... FONT>, об€зательно использующийс€ с одним или несколькими атрибутами, измен€ющими размер, цвет и гарнитуру шрифта:

—интаксис атрибута

Ќазначение

SIZE = значение

–азмер задаетс€ либо в форме абсолютного значени€ (число от 1 до 7), либо относительно размера основного шрифта (в форме +n или -n).

COLOR = цвет

÷вет

FACE = список шрифтов

√арнитуры дл€ отображени€ текста; названи€ перечисл€ютс€ в пор€дке предпочтени€ через зап€тую, например, FACE=ЂVerdana, Helvetica, Arial, Sans-Serifї

ћожно указывать и одну из гарнитур, но следует учитывать, что данный шрифт может быть не установлен на компьютере пользовател€, и Ђэкзотическиеї шрифты отображатьс€ браузером не будут

3.2 ‘орматирование абзацев

html тег форматирование символ

“екст выводитс€ в окно браузера слово за словом, при достижении правой границы окна очередное слово автоматически переноситс€ на новую строку. ƒаже если в коде страницы было введено несколько пробелов или текст записывалс€ с новой строки, при просмотре в браузере эти действи€ отображены не будут. ѕоэтому чтобы вывести в тексте р€д последовательных пробелов или несколько пустых строк, приходитс€ примен€ть различные теги.

“ег (от английского break) разрывает текстовый поток и вставл€ет новую строку без образовани€ нового абзаца. Ќесколько последовательных тегов интерпретируютс€ как несколько пустых строк. ћежстрочный интервал одинарный. «акрывающего компонента тег не имеет, как и атрибутов.

“ег (от английского paragraph) начинает абзац; новый абзац отдел€етс€ от предыдущего двойным межстрочным интервалом. јбзац пустым быть не может, то есть несколько последовательных тегов интерпретируютс€ как один.

«акрывающий компонент не об€зателен, так как предыдущий абзац заканчиваетс€ там, где начинаетс€ новый. “ег имеет необ€зательный атрибут ALIGN, указывающий на вид выравнивани€ абзаца, который может принимать значени€ LEFT, CENTER, RIGHT и JUSTIFY, задающие выравнивание соответственно по левому краю, центру, правому краю и по ширине.

≈сли закрывающий компонент опустить, то заданный тип выравнивани€ сохран€етс€ до следующего тега, задающего выравнивание, или до конца документа.

HTML позвол€ет создавать форматировать абзацы как нумерованные или маркированные списки. ‘рагмент текста, представл€ющий собой список, заключаетс€ в теги:

...

упор€доченный (нумерованный) список (от английского ordered list)

...

неупор€доченный (маркированный) список (от английского unordered list)

 аждый элемент упор€доченного или неупор€доченного списка заключаетс€ в теги... (от английского list item). ѕри выводе текста каждый элемент списка будет располагатьс€ с новой строки, обозначенной номером или маркером.  роме того, у списка может быть заголовок, который задаетс€ тегом (от английского listheader). «акрывающие теги и не об€зательны.

ћногоуровневый список может быть организован посредством комбинации нумерованных и маркированных списков.

јбзацы можно оформить и в виде заголовков уровн€ (от n=1 до n=6), дл€ этого используют теги вида <Hn>... n>. «аголовок первого уровн€ выводитс€ наиболее крупным шрифтом.

4. –азмещение рисунков

»зображени€, которые демонстрируютс€ браузером при просмотре веб-страницы, хран€тс€ в отдельных файлах формата gif, jpg (jpeg) или png, а в коде страницы делаетс€ ссылка на нужный файл.

ќб€зательный атрибут:

SRC = url

јдрес графического файла (относительный или абсолютный)

ќсновные необ€зательные атрибуты:

ALT = текст

јльтернативный текст, выводимый в режиме браузера без загрузки изображений (об€зательно заключаетс€ в кавычки)

BORDER = значение

“олщина обрамл€ющей рамки в пиксел€х, 0 означает отсутствие рамки (по умолчанию)

BORDERCOLOR = цвет

«адает цвет обрамл€ющей рамки

HEIGHT = значение

¬ысота изображени€ в пиксел€х (по умолчанию оригинальна€) либо в процентах от высоты окна браузера

WIDTH = значение

Ўирина изображени€ в пиксел€х (по умолчанию оригинальна€) либо в процентах от ширины окна браузера

HSPACE = значение

—вободное пространство слева и справа от изображени€ в пиксел€х

VSPACE = значение

—вободное пространство сверху и снизу от изображени€ в пиксел€х

ALIGN = значение

¬ыравнивание изображени€ по горизонтали.

≈сли заданы значени€ LEFT либо RIGHT, изображение соответствующим образом будет выровнено по горизонтали, задание этих значений обеспечивает обтекание изображени€ текстом

–ассмотрим подробнее абсолютный и относительный способы адресации файла.

јдресаци€ в абсолютной форме используетс€ при ссылках на ресурсы, наход€щиес€ на других серверах. ”ниверсальный адрес, определ€ющий местонахождение информационного ресурса, носит название URL (Uniform Resource Locator - унифицированный адрес ресурса). URL состоит из двух частей, разделенных двоеточием. ѕерва€ часть указывает на тип сетевого протокола, который зависит от типа ресурса. Ќапример, если ресурс располагаетс€ на WWW-сервере, это протокол http. ¬тора€ часть включает в себ€ им€ компьютера (сервера) в доменной системе имен и (если требуетс€) путевое им€ файла. ѕри записи путевого имени названи€ каталогов раздел€ютс€ пр€мой косой чертой (символ /), в именах файлов и каталоговразличаютс€ прописные и строчные буквы, пробелы не допускаютс€. ¬от примеры URL:

http: //www. vshu. kirov. ru/site/images/picture1. jpg

http: //195. 21. 123. 13: 8110

ftp: //everything. com/soft/prog. zip

mailto: Ivanov@hotmail. com

ѕоследний URL, указывающий на протокол mailto и адрес электронной почты, не ссылаетс€ ни на какой информационный ресурс; это единственный тип URL, при записи которого не став€тс€ после двоеточи€ две косые черты.

јдресаци€ рисунков в абсолютной форме при создании веб-сайта практически не используетс€.

јдресаци€ в относительной форме используетс€ при ссылках на ресурсы, наход€щиес€ на том же сервере. ѕри записи пути к файлу названи€ каталогов раздел€ютс€ пр€мой косой чертой (символ /), переход по каталогам файловой системы на один уровень вверх обозначаетс€ двум€ точками (символы..). „тобы было пон€тнее, представим себе компьютер, например, с такой структурой каталогов, содержащих HTML-файлы:

SHAPE \* MERGEFORMAT

MySite

Pages

Images

Page1. htm

Page2. htm

Pict1. jpg

Pict2. jpg

Index. htm

Picture. jpg

¬ этом случае возможны, например, такие варианты записи тега IMG:

?<IMGSRC=Picture. jpg> (изображение Picture. jpg располагаетс€ на страничкеIndex. htm)

?<IMGSRC=Images/Pict1. jpg> (изображение Pict1. jpg располагаетс€ на страничкеIndex. htm)

?<IMGSRC=.. /Picture. jpg> (изображение Picture. jpg располагаетс€ на страничкеPage1. htm)

?<IMGSRC=.. /Images/Pict1. jpg> (изображение Pict1. jpg располагаетс€ на страничкеPage1. htm)

Ќесмотр€ на то, что формально об€зательным €вл€етс€ только атрибут SRC, на практике необходимо указывать и альтернативный текст (атрибут ALT), так как многие работают с браузером в режиме без загрузки изображений.

¬ысоту и ширину области, в которой демонстрируетс€ рисунок, задают при помощи атрибутов width и height в пиксел€х или в процентах к размеру экрана. ¬ том случае, когда задаетс€ один из этих атрибутов, рисунок масштабируетс€ таким образом, чтобы его высота или ширина соответствовали заданной. ¬торой размер устанавливаетс€ автоматически, в соответствующей пропорции. ѕрименение только одного из атрибутов измен€ет оба размера рисунка. ≈сли задать €вно оба атрибута, то рисунок будет масштабироватьс€ по двум ос€м в соответствии с заданными размерами. јтрибуты height и width мен€ют не врем€ загрузки изображени€, а только его вид (размер) на экране.

5. √иперссылки

√иперссылкой называют объект (текст, изображение, фрагмент изображени€), при щелчке мышью по которому происходит переход к новому документу или фрагменту документа. »менно гиперссылки позвол€ют организовать переходы между любыми размещенными в сети »нтернет документами.

5.1 “екстовые гиперссылки

—в€зь между HTML-документами и фрагментами документов организуетс€ с помощью тега... (от английского anchor - €корь).

“ег употребл€етс€ как дл€ создани€ ссылки на другой документ, так и дл€ ссылки на фрагмент документа.

ќб€зательный атрибут:

HREF = url

јдрес целевого документа (может быть представлен в абсолютной и относительной форме)

ќсновные необ€зательные атрибуты:

+

ѕомечает наход€щийс€ между <A> и A> фрагмент документа как возможный объект дл€ ссылки. ¬ качестве значени€ нужнолатиницей написать любое слово-указатель, уникальное дл€ данного документа. Ќапример, тег –аздел1 создает так называемую метку (закладку) дл€ перехода к разделу 1. ¬ этом случае можно ссылатьс€ на помеченную область простым указанием ее имени после имени документа (перед именем метки ставитс€ #).

“ак, <AHREF=ЂIndex. html#part1ї>  разделу 1A> отправит вас в раздел Ђpart1ї файла Index. html, а <AHREF=Ђ#part2ї>   разделу 2 A> ? в раздел Ђpart2ї текущего документа при условии, что в документе имеетс€ соответствующа€ метка

TARGET = Ђим€ї

»м€ кадра (фрейма) или окна дл€ вывода целевого документа.

Ётот атрибут используетс€ только совместно с параметром HREF. ¬ качестве значени€ необходимо задать либо им€ одного из существующих фреймов, либо одно из следующих зарезервированных имен:

_self - указывает, что определенный в параметре HREF документ должен отображатьс€ в текущем фрейме; _parent - указывает, что документ должен отображатьс€ во фрейме-родителе текущего фрейма (целиком зан€ть окно браузера) ;

_blank - указывает, что документ должен отображатьс€ в новом окне

TITLE=Ђтекстї

¬ыводит всплывающую подсказку при наведении указател€ мыши на гиперссылку

“екст и изображени€, размещенные между тегами станов€тс€ активной зоной документа, чувствительной к щелчку мыши, который вызывает загрузку целевого документа. “екст гиперссылки выдел€етс€ подчеркиванием и цветами, указанными как значение атрибутов LINK, ALINK, VLINK тега (либо цветом по умолчанию).

5.2 √иперссылки-картинки

„тобы сделать гиперссылкой целое изображение, также примен€етс€ тег...., только вместо текста (или вместе с текстом) между <A> и A> располагаетс€ тег <IMGЕ> со всеми соответствующими атрибутами.

5.3  арта гиперссылок

“ег позвол€ет сделать активной зоной текстовый фрагмент или изображение целиком; дл€ того же, чтобы разные фрагменты одного изображени€ ссылались на разные целевые документы, придетс€ использовать тег, реализующий изображение-карту.

” тега-контейнера единственным об€зательным атрибутом €вл€етс€ NAME, значением которого будет им€ (например, NAME=Ђmymapї, которое должно быть использовано при описании атрибута USEMAP тега IMG, описывающего изображение, призванного служить картой (при этом к имени карты приписываетс€ слева # ? USEMAP =Ђ#mymapї)

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

—интаксис атрибута

Ќазначение

COORDS = список

—писок через зап€тую координат активной зоны (зависит от типа заданной формы зоны)

HREF = url

јдрес целевого документа гиперссылки, св€занного с указанной зоной

SHAPE = форма

ќпредел€ет форму активной зоны. ¬озможные значени€ этого атрибута:

circle (окружность - задаетс€ координатами центра и радиусом в пиксел€х) ;

rect (пр€моугольник - задаетс€ координатами левого верхнего и правого нижнего угла) ;

poly (многоугольник - задаетс€ координатами своих вершин)

 оординаты во всех случа€х отсчитываютс€ от верхнего левого угла изображени€ в пиксел€х, ось ’ направлена вправо, ось Y? вниз.

NOREF

иногда бывает нужно указать, что данна€ зона (заданна€ атрибутом SHAPE и координатами COORDS) не €вл€етс€ активной, реакции на щелчок мыши нет

6. “аблицы

“аблицы в HTML-документах используютс€ не столько дл€ того, чтобы располагать данные в обрамленных €чейках, сколько с целью расположени€ фрагментов текста и изображений друг относительно друга.

“аблицы в HTML стро€тс€ построчно. ¬се табличные данные заключаютс€ в теги

...

; описание каждого р€да €чеек (строк) заключаетс€ в теги... ; содержимое каждой €чейки заключаетс€ в теги... (обычные €чейки) или <TH>... H> (заголовки).

ячейки таблицы могут содержать текст, изображени€, вложенные таблицы и т. д. Ќе следует оставл€ть €чейки таблицы незаполненными; если кака€-то €чейка должна выгл€деть пустой, поместите в нее неразрывный пробел.

ѕомещаемый в €чейки таблицы текст по умолчанию автоматически размещаетс€ браузером; текст выводитс€ слово за словом; при достижении правой границы €чейки очередное слово переноситс€ на новую строку.

ячейки таблицы могут охватывать несколько строк или столбцов; при описании таких €чеек используетс€ атрибуты ROWSPAN (€чейка, тег которой содержит данный атрибут, Ђраст€гиваетс€ї на указанное количество строк) и COLSPAN (€чейка Ђраст€гиваетс€ї на несколько столбцов).

“еги, описывающие таблицы, имеют целый р€д необ€зательных атрибутов.

јтрибуты тега задают параметры таблицы в целом:

—интаксис атрибута

Ќазначение

ALIGN = значение

¬ыравнивание относительно текстового потока; возможны значени€ left, right и center

BACKGROUND = url

‘оновое изображение дл€ всей таблицы

BGCOLOR = цвет

‘оновый цвет

<...

ѕодобные документы

–аботы в архивах красиво оформлены согласно требовани€м ¬”«ов и содержат рисунки, диаграммы, формулы и т.д.
PPT, PPTX и PDF-файлы представлены только в архивах.
–екомендуем скачать работу.