HTML. Самоучитель

Òàáëèöà óìíîæåíèÿ
	2	3	4	5	6	7	8	9
2	4	6	8	10	12	14	16	18
3	6	9	12	15	18	21	24	27
4	8	12	16	20	24	28	32	36
5	10	15	16	25	30	35	40	45
6	12	18	24	30	36	42	48	54
7	14	21	28	35	42	49	56	63
8	16	24	32	40	48	56	64	72
9	18	27	36	45	54	63	72	81

Âñòóïèòåëüíûå ýêçàìåíû:
Ýêîíîìèêà è óïðàâëåíèå íà ïðåäïðèÿòèè	Ìàòåìàòèêà, ðóññêèé ÿçûê
Êíèãîðàñïðîñòðàíåíèå	Ðóññêèé ÿçûê, èñòîðèÿ Îòå÷åñòâà
Òåõíîëîãèÿ ïîëèãðàôè÷åñêîãî ïðîèçâîäñòâà	Ìàòåìàòèêà, ðóññêèé ÿçûê
Ðåêëàìà	Ðóññêèé ÿçûê, ëèòåðàòóðà, èñòîðèÿ Îòå÷åñòâà

Ïðèìåð òàáëèöû ñ îáúåäèíåííûìè ÿ÷åéêàìè ïî âåðòèêàëè è ãîðèçîíòàëè
À11 ß÷åéêà ïåðâîãî ñòîëáöà è ïåðâîé ñòðîêè	À12 ß÷åéêà âòîðîãî ñòîëáöà è ïåðâîé ñòðîêè	À13+À23 (îáúåäèíåíèå ÿ÷ååê ïî âåðòèêàëè)
ß÷åéêà À21 âûðàâíèâàíèå ïî öåíòðó	ß÷åéêà À22 âûðàâíèâàíèå ïî ïðàâîìó êðàþ ÿ÷åéêè
ß÷åéêà À31	À32+À33 (îáúåäèíåíèå ÿ÷ååê ïî ãîðèçîíòàëè)

Òàáëèöà, â êîòîðîé îáúåäèíåíû ÿ÷åéêè
1111111	2	Îáúåäèíåíèå ïî ãîðèçîíòàëè	4	5	6	7	8	9
	4 4444	66666	88888	10000	12000	14000	16000	18000
Îáúåäèíåíèå ïî ãîðèçîíòàëè	6	9	12
4		12	16	20	24	28	32
Ò		à	á	ë	è	ö	à
Å
Ê		11	11	11	11	11	11
Ñ		11	11	11	11	11	11
Ò		11	11	11	11	11	11

Òàáëèöà ¹1
	Ñðåäíåå çíà÷åíèå
Ðîñò	Âåñ
Ìóæ÷èíû	184	88
Æåíùèíû	168	63

ÖÂÅÒÎÂÀß ÏÀÍÅËÜ RGB
Red	Êðàñíûé
Green	Çåë¸íûé
Blue	Ñèíèé

Çàãîëîâîê òàáëèöû
ÿ÷åéêà 11	ÿ÷åéêà 12
ÿ÷åéêà 21	ÿ÷åéêà 22

Çàãîëîâîê òàáëèöû
&NBSP;
&NBSP;	Ñïîñîá âûðàâíèâàíèÿ
Ïî ëåâîìó êðàþ	Öåíòðèðîâàíèå	Ïî ïðàâîìó êðàþ
Íàïðàâëåíèå	Ïî âåðòèêàëè	Ýòîò òåêñò âûðîâíåí ïî ëåâîìó êðàþ	Ýòîò òåêñò îòöåíòðèðîâàí	Ýòîò òåêñò âûðîâíåí ïî ïðàâîìó êðàþ
Ïî ãîðèçîíòàëè	Ââåðõó	Ïîñåðåäèíå	Âíèçó

Ïîäïèñü òàáëèöû ñíèçó è ñëåâà
Ñòîëáåö 1	Ñòîëáåö 2	Ñòîëáåö 3
òåêñò âûäåëåí öâåòîì	ÿ÷åéêà 12	ÿ÷åéêà 13
ÿ÷åéêà 21	ÿ÷åéêà 22	ÿ÷åéêà 23
ÿ÷åéêà 31	ÿ÷åéêà 32	ÿ÷åéêà 33

CSS (Cascading Style Sheets - êàñêàäíûå ëèñòû ñòèëåé)
Îáúåäèíåíèå äâóõ ÿ÷ååê ïî ãîðèçîíòàëè	òåêñò âûäåëåí öâåòîì	ÿ÷åéêà 12	ÿ÷åéêà 13
ÿ÷åéêà 21	ÿ÷åéêà 22	ÿ÷åéêà 23
Ñòðîêà 3	ÿ÷åéêà 31	ÿ÷åéêà 32	ÿ÷åéêà 33

Ïðîãðàììíûé êîä - òåêñò ïðîãðàììû
Ñòîëáåö 1	Îáúåäèíåíèå äâóõ ÿ÷ååê ïî âåðòèêàëå
òåêñò âûäåëåí öâåòîì	ÿ÷åéêà 12	ÿ÷åéêà 13
ÿ÷åéêà 21	ÿ÷åéêà 22	ÿ÷åéêà 23
ÿ÷åéêà 31	ÿ÷åéêà 32	ÿ÷åéêà 33

Çàãîëîâîê òàáëèöû - Ïàðàìåòð Frame = VOID
Çàãîëîâîê ñòðîêè 1 - òåã TH	òåêñò âûäåëåí öâåòîì, êóðñèâîì è ðàñïîëîæåí ñ ïðàâîãî êðàÿ	ÿ÷åéêà 12	ÿ÷åéêà 13
Çàãîëîâîê ñòðîêè 2 - òåã TH	ÿ÷åéêà 21	ÿ÷åéêà 22	ÿ÷åéêà 23
Çàãîëîâîê ñòðîêè 3 - òåã TH	ÿ÷åéêà 31	ÿ÷åéêà 32	ÿ÷åéêà 33

Çàãîëîâîê òàáëèöû
Çàãîëîâîê 1	Çàãîëîâîê 2	Çàãîëîâîê 3
ß÷åéêà 11	ß÷åéêà 12	ß÷åéêà 13
ß÷åéêà 21	ß÷åéêà 22	ß÷åéêà 23
ß÷åéêà 31	ß÷åéêà 32	ß÷åéêà 33

Çàãîëîâîê òàáëèöû
	Çàãîëîâîê 1	Çàãîëîâîê 2	Çàãîëîâîê 3	Çàãîëîâîê 4
Çàãîëîâîê 5	ß÷åéêà 11	ß÷åéêà 12	ß÷åéêà 13	ß÷åéêà 14
Çàãîëîâîê 6	ß÷åéêà 21	ß÷åéêà 22	ß÷åéêà 23	ß÷åéêà 24

Êðàòêîå ñîäåðæàíèå Áëàãîäàðíîñòè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12 Ââåäåíèå . . . . . . . ...

Author: Комолова Нина Владимировна

85 downloads 914 Views 13MB Size Report

This content was uploaded by our users and we assume good faith they have the permission to share this book. If you own the copyright to this book and it is wrongfully on our website, we offer a simple DMCA procedure to remove your content from our site. Start by pressing the button below!

Report copyright / DMCA form

DOWNLOAD PDF

Êðàòêîå ñîäåðæàíèå Áëàãîäàðíîñòè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12 Ââåäåíèå . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14 Óðîê 1. Îñíîâíûå ñâåäåíèÿ . . . . . . . . . . . . . . . . . . . . . . 21 Óðîê 2. Òåêñò . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33 Óðîê 3. Ãðàôèêà . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56 Óðîê 4. Ôîí âåá-ñòðàíèö . . . . . . . . . . . . . . . . . . . . . . . . 76 Óðîê 5. Ëèíèè, òî÷êè è äðóãèå îáúåêòû . . . . . . . . . . . . . . . . 86 Óðîê 6. Áåãóùàÿ ñòðîêà . . . . . . . . . . . . . . . . . . . . . . . . . 98 Óðîê 7. Ñïèñêè . . . . . . . . . . . . . . . . . . . . . . . . . . . . 103 Óðîê 8. Òàáëèöû . . . . . . . . . . . . . . . . . . . . . . . . . . . . 118 Óðîê 9. Ôîðìû . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153 Óðîê 10. Ôðåéìû . . . . . . . . . . . . . . . . . . . . . . . . . . . . 164 Óðîê 11. Ññûëêè . . . . . . . . . . . . . . . . . . . . . . . . . . . . 188 Óðîê 12. Ìóëüòèìåäèà . . . . . . . . . . . . . . . . . . . . . . . . . 198 Óðîê 13. Áàííåðíàÿ ðåêëàìà . . . . . . . . . . . . . . . . . . . . . . 207 Óðîê 14. Ïóáëèêàöèÿ è ïîèñê äîêóìåíòîâ . . . . . . . . . . . . . . . 214 Óðîê 15. Åùå ðàç ñ íà÷àëà . . . . . . . . . . . . . . . . . . . . . . . 221 Óðîê 16. Ñëîè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 226 Óðîê 17. Êàñêàäíûå ëèñòû ñòèëåé . . . . . . . . . . . . . . . . . . . 234 Óðîê 18. Ïîäãîòîâêà èçîáðàæåíèé äëÿ âåá-ñòðàíèö . . . . . . . . . 253 Àëôàâèòíûé óêàçàòåëü . . . . . . . . . . . . . . . . . . . . . . . . 261

Ñîäåðæàíèå Áëàãîäàðíîñòè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12 Ââåäåíèå . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14 Îò èçäàòåëüñòâà . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20

Óðîê 1. Îñíîâíûå ñâåäåíèÿ . . . . . . . . . . . . . . . . . . . . . . . 21 Îñíîâíûå ïîíÿòèÿ Áðàóçåð

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25

Ñòðóêòóðà äîêóìåíòà . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25 Ãèïåðòåêñòîâûå ññûëêè . . . . . . . . . . . . . . . . . . . . . . . . . . . 26 Èçìåíåíèå ïðîãðàììû

. . . . . . . . . . . . . . . . . . . . . . . . . . . 27

Òåãè è àòðèáóòû . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28 Îñíîâíûå ïðàâèëà ñîçäàíèÿ âåá-ñòðàíèö

. . . . . . . . . . . . . . . . . 29

Àòðèáóòû òåãà . . . . . . . . . . . . . . . . . . . . . . . . . . 29 Ïîäâåäåì èòîãè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32

Óðîê 2. Òåêñò . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33 Ïåðâàÿ âåá-ñòðàíèöà

. . . . . . . . . . . . . . . . . . . . . . . . . . . . 34

Óðîâíè çàãîëîâêîâ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34 Øðèôò . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36 Àáçàöû è ðàçðûâû ñòðîê . . . . . . . . . . . . . . . . . . . . . . . . . . 38 Âûðàâíèâàíèå . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40 Ïðåäâàðèòåëüíîå ôîðìàòèðîâàíèå . . . . . . . . . . . . . . . . . . . . . 41 Çàäàíèå íà÷åðòàíèÿ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43 Íåðàçðûâíûå ñòðîêè . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46 Âñòàâêà öèòàò . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47

7

Ñîäåðæàíèå

Êîììåíòàðèè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 48 Àêðîíèìû . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49 Îïðåäåëåíèÿ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50 Øðèôòîâîå âûäåëåíèå . . . . . . . . . . . . . . . . . . . . . . . . . . . 50 Èñïîëüçîâàíèå ìîíîøèðèííûõ øðèôòîâ

. . . . . . . . . . . . . . . . . 51

Äîáàâëåíèå òåêñòà ñ äðóãîé ñòðàíèöû . . . . . . . . . . . . . . . . . . . 53 Ðàññòàíîâêà ïðîáåëîâ . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54 Ïîäâåäåì èòîãè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55

Óðîê 3. Ãðàôèêà . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56 Ðàçìåùåíèå ãðàôèêè íà âåá-ñòðàíèöå . . . . . . . . . . . . . . . . . . . 57 Ôîðìàòû ãðàôè÷åñêèõ ôàéëîâ Ôîðìàò GIF . . . . . . . . Ôîðìàò JPEG . . . . . . . Ôîðìàò PNG . . . . . . . . Ôîðìàò BMP . . . . . . . . Ôîðìàò PCX . . . . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

58 58 59 59 59 60

Ïèêñåëû è ðàçðåøåíèå . . . . . . . . . . . . . . . . . . . . . . . . . . . 60 Ïðèìåðû ðàçìåùåíèÿ ãðàôèêè íà âåá-ñòðàíèöå . . . . . . . . . . . . . . 61 Âûðàâíèâàíèå èçîáðàæåíèé

. . . . . . . . . . . . . . . . . . . . . . . . 65

Êàðòû èçîáðàæåíèé . . . . . . Òåã <MAP> . . . . . . . . Òåã . . . . . . . . Ïðèìåðû êàðò èçîáðàæåíèé

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

66 67 67 69

Ìàñøòàáèðîâàíèå èçîáðàæåíèé . . . . . . . . . . . . . . . . . . . . . . 72 Ïîäâåäåì èòîãè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 75

Óðîê 4. Ôîí âåá-ñòðàíèö . . . . . . . . . . . . . . . . . . . . . . . . . 76 Ôîíîâûå ðèñóíêè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77 Çàäàíèå ñòàíäàðòíûõ öâåòîâ . . . . . . . . . . . . . . . . . . . . . . . . 78 Ïîäâåäåì èòîãè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 85

Óðîê 5. Ëèíèè, òî÷êè è äðóãèå îáúåêòû . . . . . . . . . . . . . . . . . 86 Ãîðèçîíòàëüíûå ëèíèè . . . . . . . . . . . . . . . . . . . . . . . . . . . 87 Êëàâèàòóðíûå ñèìâîëû . . . . . . . . . . . . . . . . . . . . . . . . . . . 89 Ñïåöèàëüíûå ñèìâîëû . . . . . . . . . . . . . . . . . . . . . . . . . . . 92

8

Ñîäåðæàíèå

Èíôîðìàöèÿ îá àâòîðå äîêóìåíòà . . . . . . . . . . . . . . . . . . . . . 94 Java-àïïëåòû . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95 Ñöåíàðèè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95

Âíåøíèå îáúåêòû è êîììåíòàðèè

. . . . . . . . . . . . . . . . . . . . . 96

Ëèñòû ñòèëåé . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 96 Ïîäâåäåì èòîãè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 97

Óðîê 6. Áåãóùàÿ ñòðîêà . . . . . . . . . . . . . . . . . . . . . . . . . 98 Âñòàâêà áåãóùåé ñòðîêè íà âåá-ñòðàíèöó

. . . . . . . . . . . . . . . . . 99

Ïðèìåð áåãóùåé ñòðîêè . . . . . . . . . . . . . . . . . . . . . . . . . . . 99 Ðèñóíîê â êà÷åñòâå áåãóùåé ñòðîêè . . . . . . . . . . . . . . . . . . . . 101 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102

Óðîê 7. Ñïèñêè . . . . . . . . . . . . . . . . . . . . . . . . . . . . 103 Âèäû ñïèñêîâ

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 104

Íóìåðîâàííûå ñïèñêè . . . . . . . . . . . . . . . . . . . . . . . . . . . 104 Ìàðêèðîâàííûå ñïèñêè . . . . . . . . . . . . . . . . . . . . . . . . . . 109 Âëîæåííûå ñïèñêè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 112 Ñïèñêè îïðåäåëåíèé . . . . . . . . . . . . . . . . . . . . . . . . . . . . 114 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 117

Óðîê 8. Òàáëèöû . . . . . . . . . . . . . . . . . . . . . . . . . . . . 118 Îñíîâíûå òåãè òàáëèö . . . . . . . . . . . Ñîçäàíèå òàáëèö . . . . . . . . . . . . Ñîçäàíèå ñòðîê è ñòîëáöîâ òàáëèöû . . Ñîçäàíèå ÿ÷ååê òàáëèöû . . . . . . . . Ñîçäàíèå çàãîëîâêà è ïîäïèñè òàáëèöû

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

119 119 120 120 121

Òåãè ãðóïïèðîâàíèÿ ýëåìåíòîâ òàáëèö . . . . . . . . . . . . . . . . . . 121 Ãðóïïèðîâàíèå ñòîëáöîâ òàáëèöû . . . . . . . . . . . . . . . . . . . 121 Ãðóïïèðîâàíèå ñòðîê òàáëèöû . . . . . . . . . . . . . . . . . . . . . 121 Îñíîâíûå àòðèáóòû ýëåìåíòîâ òàáëèöû

. . . . . . . . . . . . . . . . . 122

Ïðèìåðû òàáëèö . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 123 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 152

Óðîê 9. Ôîðìû . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153 Ñîçäàíèå ôîðì . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 154 Ðàçìåùåíèå íà ôîðìå ýëåìåíòîâ óïðàâëåíèÿ . . . . . . . . . . . . . . . 156

9

Ñîäåðæàíèå

Ñïèñêè âûáîðà . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 159 Ìíîãîñòðî÷íûå òåêñòîâûå ïîëÿ . . . . . . . . . . . . . . . . . . . . . . 162 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 163

Óðîê 10. Ôðåéìû . . . . . . . . . . . . . . . . . . . . . . . . . . . . 164 Ñâîéñòâà ôðåéìîâ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 165 Íàáîðû ôðåéìîâ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 165 Âñòàâêà ôðåéìà â äîêóìåíò ñ íàáîðîì ôðåéìîâ . . . . . . . . . . . . . 167 Âñòàâêà ôðåéìà â äîêóìåíò áåç íàáîðà ôðåéìîâ . . . . . . . . . . . . . 168 Âçàèìîäåéñòâèå ôðåéìîâ . . . . . . . . . . . . . . . . . . . . . . . . . 169 Ïðèìåðû èñïîëüçîâàíèÿ ôðåéìîâ . . . . . . . . . . . . . . . . . . . . . 170 Ïðèìåðû âçàèìîäåéñòâèÿ ôðåéìîâ . . . . . . . . . . . . . . . . . . . . 179 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 187

Óðîê 11. Ññûëêè . . . . . . . . . . . . . . . . . . . . . . . . . . . . 188 Óíèâåðñàëüíûé óêàçàòåëü ðåñóðñà . . . . . . . . . . . . . . . . . . . . . 189 Âñòàâêà ññûëîê â äîêóìåíò . . . . . . . . . . . . . . . . . . . . . . . . 190 Âíóòðåííèå ññûëêè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . 191

Âíåøíèå ññûëêè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 192 Ïåðåõîäû âíóòðè äîêóìåíòà . . . . . . . . . . . . . . . . . . . . . . . . 193 Ãðàôè÷åñêèå ññûëêè . . . . . . . . . . . . . . . . . . . . . . . . . . . . 196 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 197

Óðîê 12. Ìóëüòèìåäèà . . . . . . . . . . . . . . . . . . . . . . . . . 198 Ðàçìåùåíèå îáúåêòîâ ìóëüòèìåäèà íà âåá-ñòðàíèöàõ . . . . . . . . . . 199 Àíèìàöèîííûå ôàéëîâûå ôîðìàòû Ôîðìàò SWF . . . . . . . . . . Ôîðìàò AVI . . . . . . . . . . . Ôîðìàò MOV . . . . . . . . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

. . . .

201 201 202 202

Ñåìåéñòâî ôîðìàòîâ MPEG . . . . . . . . . . . . . . . . . . . . . . . . 202 Çâóêîâûå ôîðìàòû Ôîðìàò WAV . Ôîðìàò AIFF . Ôîðìàò MIDI . Ôîðìàò MP3 .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

203 203 203 204 204

Ïîòîêîâûå äàííûå . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 204 Òåõíîëîãèÿ Real Audio/Video . . . . . . . . . . . . . . . . . . . . . 205

10

Ñîäåðæàíèå

Òåõíîëîãèè Windows Media Server è Windows Media Player . . . . . 205 Òåõíîëîãèè QuickTime Streaming Server è QuickTime Player . . . . . 206 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 206

Óðîê 13. Áàííåðíàÿ ðåêëàìà . . . . . . . . . . . . . . . . . . . . . . 207 Îïðåäåëåíèå áàííåðà

. . . . . . . . . . . . . . . . . . . . . . . . . . . 208

Ýôôåêòèâíîñòü áàííåðîâ . . . . . . . . . . . . . . . . . . . . . . . . . 208 Ïðèìåðû áàííåðîâ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 210 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 213

Óðîê 14. Ïóáëèêàöèÿ è ïîèñê äîêóìåíòîâ . . . . . . . . . . . . . . . 214 Ïîäãîòîâêà è ïóáëèêàöèÿ âåá-ñàéòà . . . . . . . . . . . . . . . . . . . . 215 Ïîèñê èíôîðìàöèè â Èíòåðíåòå . . . . . . . . . . . . . . . . . . . . . 217 Ïîèñê èíôîðìàöèè ïî URL-àäðåñàì . . . . . . . . . . . . . . . . . 218 Ïîèñêîâûå ñèñòåìû . . . . . . . . . . . . . . . . . . . . . . . . . . . 219 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 220

Óðîê 15. Åùå ðàç ñ íà÷àëà . . . . . . . . . . . . . . . . . . . . . . . 221 Âåðñèÿ ÿçûêà HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . 222 META-èíôîðìàöèÿ . . . . . . . . . . . . . . . . . . . . . . . . . . . . 223 Àòðèáóò NAME . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 223 Àòðèáóò HTTP-EQUIV . . . . . . . . . . . . . . . . . . . . . . . . . 224 Ñâÿçü âåá-ñòðàíèöû ñ äîïîëíèòåëüíûìè ôàéëàìè . . . . . . . . . . . . 225 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 225

Óðîê 16. Ñëîè . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 226 Ïîíÿòèå ñëîÿ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 227 Ñîçäàíèå ñëîÿ ñ ïîìîùüþ òåãà

. . . . . . . . . . . . . . . . . . 227 Ñîçäàíèå ñëîÿ ñ ïîìîùüþ òåãà . . . . . . . . . . . . . . . . 231 Ñîçäàíèå äèíàìè÷åñêîãî ñëîÿ . . . . . . . . . . . . . . . . . . . . . . . 232 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 233

Óðîê 17. Êàñêàäíûå ëèñòû ñòèëåé . . . . . . . . . . . . . . . . . . . 234 Ïîääåðæêà ñòèëåé . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 235 Óðîâíè CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 235 Ñèíòàêñèñ ëèñòà ñòèëÿ . . . . . . . . . . . . . . . . . . . . . . . . . . . 236 Ãðóïïèðîâàíèå ñòèëåé è ñåëåêòîðû êëàññîâ

. . . . . . . . . . . . . . . 237

11

Ñîäåðæàíèå

×åòûðå âàðèàíòà èñïîëüçîâàíèÿ Âñòðàèâàåìûå ñòèëè . . . . Ïîäêëþ÷àåìûå ñòèëè . . . . Ñâÿçûâàåìûå ñòèëè . . . . . Èìïîðòèðóåìûå ñòèëè . . .

CSS . . . . . . . . . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

238 238 238 241 242

Ïðèìåðû èñïîëüçîâàíèÿ ñòèëåé . . . . . . . . . . . . . . . . . . . . . . 244 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 252

Óðîê 18. Ïîäãîòîâêà èçîáðàæåíèé äëÿ âåá-ñòðàíèö . . . . . . . . . 253 Ôàéëîâûå îïåðàöèè . . . . . . . . . . . . . . . . . . . . . . . . . . . . 254 Èíñòðóìåíòû âûäåëåíèÿ

. . . . . . . . . . . . . . . . . . . . . . . . . 255

Èçìåíåíèå ðàçðåøåíèÿ è ðàçìåðîâ èçîáðàæåíèÿ . . . . . . . . . . . . . 256 Êîððåêöèÿ èçîáðàæåíèÿ . . . . . . . . . . . . . . . . . . . . . . . . . . 258 Ïîäâåäåì èòîãè

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 260

Àëôàâèòíûé óêàçàòåëü . . . . . . . . . . . . . . . . . . . . . . . . 261

Áëàãîäàðíîñòè Ïîÿâëåíèåì ýòîé êíèãè ÿ îáÿçàíà ìíîãèì ëþäÿì. Íà÷àòü ÿ õî÷ó ñî ñëîâ áëàãîäàðíîñòè ïðåçèäåíòó èçäàòåëüñêîãî äîìà «Ïèòåð» Âàäèìó Óñìàíîâó è ãëàâíîìó ðåäàêòîðó Åêàòåðèíå Ñòðîãàíîâîé çà òî, ÷òî, íåñìîòðÿ íà ñâîþ çàíÿòîñòü, îíè âñåãäà îòêëèêàëèñü íà ïðèãëàøåíèå Ñåâåðî-Çàïàäíîãî èíñòèòóòà ïå÷àòè Ñàíêò-Ïåòåðáóðãñêîãî ãîñóäàðñòâåííîãî óíèâåðñèòåòà òåõíîëîãèè è äèçàéíà è ïðèåçæàëè 1 ñåíòÿáðÿ íà ïðàçäíèê «Äåíü Ïåðâîêóðñíèêà», îäíèì èç îðãàíèçàòîðîâ êîòîðîãî ÿ ÿâëÿëàñü. Îíè ïðèâåòñòâîâàëè íàïóòñòâåííîé ðå÷üþ ñòóäåíòîâ 1 êóðñà, êîòîðûå ðåøèëè ñâÿçàòü ñâîþ æèçíü ñ îòðàñëüþ ïå÷àòè è ñòàòü ðåäàêòîðàìè, òåõíîëîãàìè ïîëèãðàôè÷åñêîãî ïðîèçâîäñòâà èëè ñïåöèàëèñòàìè ïî ïîëèãðàôè÷åñêîìó îáîðóäîâàíèþ. ß î÷åíü áëàãîäàðíà çà îðãàíèçàöèþ è ïîìîùü â ðàáîòå ðóêîâîäèòåëþ ïðîåêòà, ê. ò. í. Àíàòîëèþ Àäàìåíêî, ñ êîòîðûì ìåíÿ ñâÿçûâàåò íàøà àëüìà-ìàòåð — ìàòåìàòèêî-ìåõàíè÷åñêèé ôàêóëüòåò Ñàíêò-Ïåòåðáóðãñêîãî ãîñóäàðñòâåííîãî óíèâåðñèòåòà. ß î÷åíü áëàãîäàðíà ä. ò. í., ïðîôåññîðó Äðîçäîâó Âàëåíòèíó Íèëîâè÷ó çà òî, ÷òî îí ïîâåðèë â ìîé òàëàíò ïðåïîäàâàòåëÿ è äîâåðèë ìíå ïðåïîäàâàíèå â èíñòèòóòå. ß î÷åíü áëàãîäàðíà çàâåäóþùåìó êàôåäðîé ïðèêëàäíîé ìàòåìàòèêè è èíôîðìàòèêè Ñàíêò-Ïåòåðáóðãñêîãî ãîñóäàðñòâåííîãî àðõèòåêòóðíî-ñòðîèòåëüíîãî óíèâåðñèòåòà, ä. ô.-ì. í., ïðîôåññîðó Âàãåðó Áîðèñó Ãåîðãèåâè÷ó, êîòîðûé èíèöèèðîâàë ÷òåíèå ìíîþ êóðñà ëåêöèé «Ââåäåíèå â Èíòåðíåò-òåõíîëîãèè». Áëàãîäàðíà ñòóäåíòàì ôàêóëüòåòà «Ïðîìûøëåííîå è ãðàæäàíñêîå ñòðîèòåëüñòâî», ïîòîêó, ñîñòîÿùåìó èç ÷åòûðåõ ãðóïï, êîòîðûå ïðèâåòñòâîâàëè ìåíÿ âñòàâàíèåì, êîãäà ÿ âõîäèëà â àóäèòîðèþ. ß î÷åíü áëàãîäàðíà ìîåìó íàó÷íîìó êîíñóëüòàíòó, àêàäåìèêó Ðîññèéñêîé àêàäåìèè îáðàçîâàíèÿ, çàñëóæåííîìó äåÿòåëþ íàóêè è òåõíèêè ÐÔ, ä. ò. í., ïðîôåññîðó, çàâ. êàôåäðîé ÀÑÎÈÓ Ñàíêò-Ïåòåðáóðãñêîãî ãîñóäàðñòâåííîãî ýëåêòðîòåõíè÷åñêîãî óíèâåðñèòåòà «ËÝÒÈ» Ñîâåòîâó Áîðèñó ßêîâëåâè÷ó çà òî, ÷òî îí îêàçûâàë ìíå ïîìîùü ïðè ïîñòóïëåíèè â äîêòîðàíòóðó Ñàíêò-Ïåòåðáóðãñêîãî ãîñóäàðñòâåííîãî ýëåêòðîòåõíè÷åñêîãî óíèâåðñèòåòà «ËÝÒÈ». ß î÷åíü áëàãîäàðíà ìîåìó ðåäàêòîðó Àëåêñåþ Æäàíîâó, êîòîðûé íåïîñðåäñòâåííî ðàáîòàë ñ ðóêîïèñüþ, çà åãî êðîïîòëèâóþ è ïðîôåññèîíàëüíóþ ðàáîòó.

Áëàãîäàðíîñòè

13

Î÷åíü ïðèçíàòåëüíà âñåì ñîòðóäíèêàì èçäàòåëüñòâà, ÷üèìè óñèëèÿìè ïîÿâèëàñü ìîÿ êíèãà. Áëàãîäàðíà òîìó ÷åëîâåêó, êîòîðûé ìíå êàê-òî ñêàçàë: «Íàäî ïèñàòü íîâóþ êíèãó. ×èòàòåëè æäóò». Áëàãîäàðíà ñâîèì ðîäíûì è áëèçêèì çà ïîääåðæàíèå òâîð÷åñêîãî íàñòðîÿ. À áîëüøå âñåãî ÿ áëàãîäàðíà ñâîèì ó÷åíèêàì, êîòîðûå ñòðåìÿòñÿ ê çíàíèÿì, òðåáóþò èõ è çàñòàâëÿþò ïîñòîÿííî áûòü â ôîðìå: ëèñòàòü êíèãè, ÷èòàòü êíèãè, îáùàòüñÿ ñ ïðîôåññèîíàëàìè, ïóòåøåñòâîâàòü ïî âåá-ñòðàíèöàì Èíòåðíåòà. Êîìîëîâà Íèíà Âëàäèìèðîâíà

Ââåäåíèå Åñëè áû ÿ çíàë òîãäà, ñêîëüêî ëþäåé áóäóò óêàçûâàòü URL, òî íå ñòàë áû èñïîëüçîâàòü â ñèíòàêñèñå äâà ñëýøà. Òèì Áåðíåðñ-Ëè Ñåãîäíÿ êàæäûé çíàåò, ÷òî òàêîå Èíòåðíåò è âåá-ñòðàíèöà; ýòè ïîíÿòèÿ ñòàëè ÷àñòüþ ïîâñåäíåâíîé æèçíè. Î íèõ ãîâîðÿò, î íèõ äóìàþò, ó÷ðåæäåíèÿ âêëþ÷àþò àäðåñà ñâîèõ óçëîâ Èíòåðíåòà â ðåêëàìíûå ïðîñïåêòû. Ýëåêòðîííûå àäðåñà ïîêàçûâàþò ïî òåëåâèçîðó, íàçûâàþò â ðàäèîïåðåäà÷àõ. Ïîýòîìó è òåìà ñîçäàíèÿ âåá-ñòðàíèö èíòåðåñíà ìíîãèì. Ñîãëàñíî íåêîòîðûì èñòî÷íèêàì, â Èíòåðíåòå òîëüêî 2 % ðóññêîÿçû÷íûõ ñàéòîâ, ïîýòîìó ñìûñëîâîå ñîäåðæàíèå 98 % ðåñóðñîâ Ñåòè íåäîñòóïíî òåì, êòî íå âëàäååò èíîñòðàííûìè ÿçûêàìè (êàðòèíêè ìîæíî ñìîòðåòü, à âñå îñòàëüíîå äîìûñëèâàòü), ïîýòîìó àâòîð êíèãè ïîïûòàåòñÿ ñäåëàòü âñå, ÷òî â åãî ñèëàõ, ÷òîáû ðóññêîÿçû÷íûõ ñàéòîâ â Èíòåðíåòå áûëî êàê ìîæíî áîëüøå. Ñîçäàâàéòå ðóññêîÿçû÷íûå ñàéòû! Ñ ïîÿâëåíèåì ïåðâûõ êîìïüþòåðîâ âîçíèêëà ïðîáëåìà ïåðåäà÷è èíôîðìàöèè ìåæäó íèìè. È ñðåäñòâà áûëè íàéäåíû — ýòî ðàçëè÷íûå íîñèòåëè è êàáåëü. Áûëè íàïèñàíû ïðîãðàììû, ïîçâîëÿþùèå ïåðåäàâàòü è ïîëó÷àòü äàííûå, è ïðàêòè÷åñêè ñðàçó âîçíèêëà âòîðàÿ ïðîáëåìà — ïðîáëåìà ñîâìåñòèìîñòè: êàê çàñòàâèòü äâà è áîëåå êîìïüþòåðà, ñîåäèíåííûõ êàáåëåì, ðàáîòàòü â ëîêàëüíîé ñåòè. Îôèöèàëüíûì äíåì ðîæäåíèÿ Èíòåðíåòà ñ÷èòàåòñÿ 2 ÿíâàðÿ 1969 ãîäà, êîãäà Óïðàâëåíèå ïåðñïåêòèâíûõ èññëåäîâàíèé (Advanced Research Project Agency, ARPA) Ìèíèñòåðñòâà îáîðîíû ÑØÀ íà÷àëî ðàáîòó íàä ïðîåêòîì ñâÿçè îáîðîííûõ êîìïüþòåðîâ.

Ââåäåíèå

15

Â 1970-å ãîäû Èíòåðíåò âûðîñ â ìåæäóíàðîäíóþ ñåòü. Ïåðâûìè ñëóæáàìè Èíòåðíåòà ñòàëè ýëåêòðîííàÿ ïî÷òà (electronic mail, e-mail) è ãðóïïû íîâîñòåé (Usernet). Â 1980-å ãîäû áûëà ðàçðàáîòàíà ñåòü Bitnet. Ýòà ñåòü, ñîçäàííàÿ ñïåöèàëèñòàìè Íüþ-Éîðêñêîãî óíèâåðñèòåòà (City University of New York), èìåëà áîëüøîå çíà÷åíèå, ïîñêîëüêó ïåðâîíà÷àëüíî íå ïðåäíàçíà÷àëàñü íè äëÿ âîåííûõ, íè äëÿ èññëåäîâàòåëüñêèõ öåëåé è â òî æå âðåìÿ âõîäèëà â ñîñòàâ Èíòåðíåòà. Â 1984 ãîäó áûëà ïðåäëîæåíà äîìåííàÿ ñèñòåìà èìåí (Domain Name System, DNS), îòîáðàæàþùàÿ ñèìâîëüíûå èìåíà íà IP-àäðåñà. Äî êîíöà 1980-õ ãîäîâ Èíòåðíåò ñóùåñòâîâàë êàê îáúåäèíåíèå íåñêîëüêèõ áîëüøèõ ñåòåé. Â 1986 ãîäó Ìåæäóíàðîäíàÿ îðãàíèçàöèÿ ïî ñòàíäàðòèçàöèè (International Organization for Standardizations, ISO) ïðèíÿëà ïåðâûé ñòàíäàðò ISO-8879, íàçâàííûé SGML (Standard Generalized Markup Language — ñòàíäàðòíûé îáîáùåííûé ÿçûê ðàçìåòêè). SGML — îáîãàùåííûé ìåòàÿçûê, ïîçâîëÿþùèé ñòðîèòü ñèñòåìû ëîãè÷åñêîé è ñòðóêòóðíîé ðàçìåòêè òåêñòîâ ëþáûõ ðàçíîâèäíîñòåé. Ñòðóêòóðíàÿ ðàçìåòêà — ôîðìàòèðîâàíèå òåêñòà, â êîòîðîì óïðàâëÿþùèå êîäû íå íåñóò íèêàêîé èíôîðìàöèè î âíåøíåì âèäå äîêóìåíòà, à ëèøü óêàçûâàþò ãðàíèöû è ñîïîä÷èíåíèå åãî ñîñòàâíûõ ÷àñòåé, òî åñòü çàäàþò åãî ëîãè÷åñêóþ ñòðóêòóðó. SGML-äîêóìåíò òðåáóåò îïðåäåëåíèÿ òèïà äîêóìåíòà (Document Type Definition, DTD). DTD ïîñûëàåòñÿ âìåñòå ñ SGML-äîêóìåíòîì èëè âêëþ÷àåòñÿ â SGML-äîêóìåíò äëÿ òîãî, ÷òîáû ìîæíî áûëî ðàñïîçíàòü òåãè, ñîçäàííûå ïîëüçîâàòåëåì. ßçûê SGML íå ïîëó÷èë ðàñïðîñòðàíåíèÿ, îäíàêî åãî èäåîëîãèÿ ïîâëèÿëà íà ìíîãèå êîìïüþòåðíûå ðàçðàáîòêè. Â 1989 ãîäó âûïóñêíèê Îêñôîðäñêîãî óíèâåðñèòåòà, áàêàëàâð â îáëàñòè ôèçèêè, ñîòðóäíèê Åâðîïåéñêîãî öåíòðà ÿäåðíûõ èññëåäîâàíèé (CERN) Òèì Áåðíåðñ-Ëè (Tim Berners-Lee) ðàçðàáîòàë ÿçûê HTML (HyperText Markup Language — ÿçûê ðàçìåòêè ãèïåðòåêñòà), ñòàâøèé îñíîâíûì ÿçûêîì ñîçäàíèÿ âåá- äîêóìåíòîâ è ïðîòîòèïîì Âñåìèðíîé ïàóòèíû (World Wide Web, WWW). Òèì Áåðíåðñ-Ëè — àâòîð èäåîëîãèè ãèïåðññûëîê (ðèñ. 0.1). Ïî ñóòè, ÿçûê HTML — ýòî íàáîð SGML-ïðåäïèñàíèé, ñôîðìóëèðîâàííûé â âèäå DTD. Â ñëó÷àå ÿçûêà HTML îïðåäåëåíèå òèïà äîêóìåíòà õðàíèòñÿ â áðàóçåðå, è ýòî îïðåäåëåíèå íàìíîãî ïðîùå, ÷åì DTD ÿçûêà SGML. Îäíàêî íåëüçÿ ñêàçàòü, ÷òî èìåííî Òèì Áåðíåðñ-Ëè îäèí âñå è ïðèäóìàë. Ê îòêðûòèþ ïîäîøëî âñå ÷åëîâå÷åñòâî, íàêîïèâ äîñòàòî÷íûå çíàíèÿ. Òàê, åùå â ñåðåäèíå äâàäöàòîãî ñòîëåòèÿ Âàííåâàð Áóø (Vannevar Bush) îáúÿâèë ìèðó íîâîå ñëîâî — «ãèïåðòåêñò», à Òåä Íåëüñîí (Ted Nelson) ïðåäëîæèë ñîçäàòü «äîêóìåíòàðíóþ âñåëåííóþ», ñâÿçàâ âñå òåêñòû, ïðîèçâåäåííûå íà ñâåò ÷åëîâå÷åñòâîì, ïåðåêðåñòíûìè ññûëêàìè, íî â íà÷àëå 60-õ ãîäîâ äâàäöàòîãî ñòîëåòèÿ ó àêàäåìè÷åñêîé ïóáëèêè ýòî âîççâàíèå íå âûçâàëî íè÷åãî, êðîìå ñíèñõîäèòåëüíîé óëûáêè. Îñåíüþ 1990 ãîäà ñîòðóäíèêè CERN ïîëó÷èëè â ïîëüçîâàíèå ïåðâûé âåá-ñåðâåð è âåá-áðàóçåð, ñîçäàííûå Òèìîì Áåðíåðñîì-Ëè â ñðåäå NeXTStep. Äëÿ ðàáîòû ñ òåêñòàìè áûë ðàçðàáîòàí ñïåöèàëüíûé ïðîòîêîë ïåðåäà÷è ãèïåðòåêñòà (HyperText Transfer Protocol, HTTP). Ýòà òåõíîëîãèÿ äàëà îãðîìíûé òîë÷îê ðàçâèòèþ Ñåòè, è Èíòåðíåò ñòàë äåéñòâèòåëüíî èíòåðíàöèîíàëüíîé ñåòüþ.

16

Ââåäåíèå

Ðèñ. 0.1. Òèì Áåðíåðñ-Ëè — ñîçäàòåëü ÿçûêà HTML

Ëåòîì 1991 ãîäà ïðîåêò WWW, ïîêîðèâøèé íàó÷íûé ìèð Åâðîïû, ïåðåñåê îêåàí è âëèëñÿ â àìåðèêàíñêèé ïðîåêò Internet. Ïîÿâèëñÿ ðÿä íîâûõ àááðåâèàòóð: URL, HTTP, HTML. Âñïûõíóâøåå áûëî ñîïåðíè÷åñòâî ìåæäó Åâðîïîé è Àìåðèêîé çà íîâóþ èíôîðìàöèîííóþ òåõíîëîãèþ ñîøëî íà íåò ñ ïåðååçäîì Òèìà Áåðíåðñà-Ëè â ÑØÀ. Â 1994-ì îí ñíà÷àëà âîçãëàâèë êàôåäðó â Ìàññà÷óñåòñêîì òåõíîëîãè÷åñêîì èíñòèòóòå, à çàòåì — ìåæäóíàðîäíûé êîíñîðöèóì W3C (World Wide Web Consortium), èãðàþùèé ðîëü îðãàíà ïî ñòàíäàðòèçàöèè Âñåìèðíîé ïàóòèíû. Èíòåðíåò ïðåäñòàâëÿåò ñîáîé îáúåäèíåíèå ìíîæåñòâà ëîêàëüíûõ êîìïüþòåðíûõ ñåòåé. Õîòÿ ãîâîðÿò, ÷òî ó Èíòåðíåòà íåò õîçÿèíà è îí íå ïðèíàäëåæèò íèêîìó, â íåì, êàê ïîêàçàíî íà ðèñ. 0.2, íàáëþäàåòñÿ ÷åòêàÿ èåðàðõè÷åñêàÿ ñòðóêòóðà: ìàãèñòðàëè, ïðîâàéäåðû, ïîëüçîâàòåëè. Íà ðèñóíêå èñïîëüçîâàíû ñëåäóþùèå îáîçíà÷åíèÿ. m P — òî÷êà ïðèñóòñòâèÿ (Point of Presence, POP). Òî÷êàìè ïðèñóòñòâèÿ íàçûâàþò ìåñòà ïîäêëþ÷åíèÿ ê ìàãèñòðàëè ñåòè ïîñòàâùèêà óñëóã Èíòåðíåòà (Internet Service Provider, ISP), èëè ïðîâàéäåðà, îáñëóæèâàþùåãî ëîêàëüíûõ ïîëüçîâàòåëåé. m N — òî÷êà äîñòóïà (Network Access Points, NAP). Òî÷êàìè äîñòóïà, èëè öåíòðàìè îáìåíà (Internet eXñhange, IX), íàçûâàþò ìåñòà îáúåäèíåíèÿ ñåòåé íåñêîëüêèõ ïðîâàéäåðîâ.

Ââåäåíèå

17

m DNS — ñåðâåð äîìåííîé ñèñòåìû èìåí (Domain Name System, DNS). DNSñåðâåðû ñëóæàò äëÿ òðàíñëÿöèè äîìåííûõ èìåí â IP-àäðåñà. m F — ôàéëîâûé (file) ñåðâåð. m W — âåá-ñåðâåð (web-server). m D — äîìåí (domain).

Ðèñ. 0.2. Ñòðóêòóðà Èíòåðíåòà

Ìíîãèå êîìïàíèè ñòàëè âûïóñêàòü ñîáñòâåííûå áðàóçåðû è ê íèì ñîáñòâåííûå ðàñøèðåíèÿ ÿçûêà HTML, íàïðèìåð, â 1993 ãîäó áûë ðàçðàáîòàí ïåðâûé ãðàôè÷åñêèé áðàóçåð Mosaic. Ïîñëå ýòîãî ïîÿâèëîñü åùå áîëåå ñòà ðàçëè÷íûõ áðàóçåðîâ. Ñàìûìè ïîïóëÿðíûìè ñòàëè Netscape Navigator è Microsoft Internet Explorer. Êîíñîðöèóì W3C ðàçðàáîòàë ñòàíäàðòû, íåîáõîäèìûå äëÿ äàëüíåéøåãî ðàçâèòèÿ World Wide Web. Â 1996 ãîäó êîíñîðöèóì W3C îáúÿâèë î ñîòðóäíè÷åñòâå ñ ëèäåðàìè ðûíêà â öåëÿõ ñòàíäàðòèçàöèè ïðîãðàììíîãî îáåñïå÷åíèÿ. Ïîÿâèâøèéñÿ â 1991 ãîäó ÿçûê HTML ïîñòîÿííî äîðàáàòûâàëñÿ è äîïîëíÿëñÿ. Èç âñåõ ýòèõ âèäîèçìåíåíèé âûäåëÿþò ñëåäóþùèå âåðñèè.

18

Ââåäåíèå

m HTML 1.0. Ïåðâàÿ âåðñèÿ ÿçûêà, ñ÷èòàÿ ãîä åãî ïîÿâëåíèÿ. m HTML 2.0. Ýòà âåðñèÿ (RFC 1866) áûëà ðàçðàáîòàíà â 1994 ãîäó. Ðàáî÷àÿ ãðóïïà ïî HTML â ñîñòàâå IETF (Internet Engineering Task Force) ââåëà ñîîòâåòñòâóþùèå èçìåíåíèÿ, è íàáîð áàçîâûõ ýëåìåíòîâ HTML 2.0 ïðèîáðåë ñòàòóñ ñòàíäàðòà. m HTML 3.0. Ýòà âåðñèÿ ÿçûêà áûëà ðåàëèçîâàíà â íà÷àëå 1996 ãîäà. Ïîÿâèëîñü ìíîãî íîâîââåäåíèé, âêëþ÷àÿ òåãè äëÿ ñîçäàíèÿ òàáëèö, ðàçìåòêè ìàòåìàòè÷åñêèõ ôîðìóë, äëÿ âñòàâêè îáòåêàåìûõ òåêñòîì ðèñóíêîâ, âñòàâêè ïðèìå÷àíèé è ò. ä. Íå íàðóøàÿ îñíîâíûå êîíöåïöèè ðàçìåòêè ãèïåðòåêñòà, àâòîðû âåðñèè 3.0 ââåëè íîâîå ñðåäñòâî — êàñêàäíûå ëèñòû ñòèëåé (Cascading Style Sheets, CSS). m HTML 3.2. Ýòà âåðñèÿ ÿçûêà áûëà ðåàëèçîâàíà â 1996 ãîäó. Â íåé áûëè ïðåäóñìîòðåíû äîïîëíèòåëüíûå ýëåìåíòû, ïðåäíàçíà÷åííûå äëÿ ñîçäàíèÿ àïïëåòîâ, çàäàíèÿ ðåãèñòðà ñèìâîëîâ è ò. ä. Âåðñèÿ HTML 3.2 ñòàëà êîìïðîìèññíûì ðåøåíèåì — ïîïûòêîé ïðèìèðèòü Microsoft è Netscape è îáúåäèíèòü èõ îðèãèíàëüíûå ðåøåíèÿ. m HTML 4.0. Ýòà âåðñèÿ ÿçûêà áûëà ðåàëèçîâàíà â 1997 ãîäó. Âòîðàÿ ñêîððåêòèðîâàííàÿ ðåàëèçàöèÿ âûøëà â 1998 ãîäó. Â HTML 4.0 áûëà ââåäåíà ïîääåðæêà ìóëüòèìåäèà, ÿçûêîâ ñöåíàðèåâ, à òàêæå ñðåäñòâ âîñïðîèçâåäåíèÿ äîêóìåíòîâ äëÿ ïîëüçîâàòåëåé ñ ôèçè÷åñêèìè îãðàíè÷åíèÿìè. Êîãäà êîíñîðöèóì W3C îïóáëèêîâàë ñïåöèôèêàöèþ ÿçûêà HTML 4,0, îí óêàçàë, ÷òî ïî÷òè âñå àòðèáóòû, îïðåäåëÿþùèå âèä HTML-äîêóìåíòà (öâåò, âûðàâíèâàíèå, øðèôòû, ãðàôèêà è ò. ä.), ÿâëÿþòñÿ íåæåëàòåëüíûìè, âçàìåí ðåêîìåíäóåòñÿ èñïîëüçîâàòü ëèñòû ñòèëåé è êëàññû. Îäíàêî áîëüøèíñòâî ðàçðàáîò÷èêîâ âåá-ñòðàíèö ïî-ïðåæíåìó ïîëüçóþòñÿ òåãàìè, êîòîðûå äàâíî çíàþò.

m HTML 4.01. Ýòà âåðñèÿ âûøëà â 1999 ãîäó. Â íåé áûëè èñïðàâëåíû îøèáêè, çàìå÷åííûå â ïðåäûäóùåé âåðñèè. Â ïîääåðæêó ÿçûêà HTML áûëà ñîçäàíà öåëàÿ ñåðèÿ ÿçûêîâ ïðîãðàììèðîâàíèÿ, òàêèõ êàê Java, JavaScript, Perl, PHP è ò. ä. Ñ ïîìîùüþ ýòèõ ÿçûêîâ ñòàëî âîçìîæíûì ñîçäàíèå äèíàìè÷åñêèõ âåá-ñòðàíèö, âêëþ÷àþùèõ ôîðìû, òàáëèöû, ôðåéìû è äðóãèå ýëåìåíòû. Â ôåâðàëå 1998 ãîäà áûë ïðåäëîæåí ÿçûê XML (Extensible Markup Language — ðàñøèðÿåìûé ÿçûê ðàçìåòêè). Ýòîò ÿçûê ïîõîæ íà HTML òåì, ÷òî äëÿ îïèñàíèÿ ðàçëè÷íûõ ðàçäåëîâ äîêóìåíòà â íåì èñïîëüçóþòñÿ òåãè. Îäíàêî â îòëè÷èå îò HTML ÿçûê XML ïîçâîëÿåò ðàçðàáîò÷èêàì îïðåäåëÿòü ñîáñòâåííûå òåãè è ñòàâèòü èì â ñîîòâåòñòâèå ñîáñòâåííûå ñïîñîáû âîñïðîèçâåäåíèÿ èíôîðìàöèè. XML-äåñêðèïòîðû ÷óâñòâèòåëüíû ê ðåãèñòðó ñèìâîëîâ. Ïîñëåäíÿÿ âåðñèÿ Internet Explorer ïîääåðæèâàåò XML. ×òî êàñàåòñÿ Netscape Navigator, òî Mozilla (ðàáî÷àÿ ãðóïïà â ñîñòàâå Netscape) ëèøü ýêñïåðèìåíòèðóåò ñî ñðåäñòâàìè ïîääåðæêè XML. ßçûê XHTML (Extensible HyperText Markup Language — ðàñøèðÿåìûé ÿçûê ðàçìåòêè ãèïåðòåêñòà) — ýòî ñî÷åòàíèå HTML è XML. Êîíñîðöèóì W3C,

Ââåäåíèå

19

îáúåäèíÿþùèé ïðåäñòàâèòåëåé áîëåå 500 îðãàíèçàöèé èç ðàçíûõ ñòðàí, ðåêîìåíäóåò èñïîëüçîâàòü XHTML âìåñòî HTML, îäíàêî íà ñåãîäíÿøíèé äåíü áîëüøèíñòâî ðàçðàáîò÷èêîâ îñòàþòñÿ âåðíûìè HTML. ßçûê Dynamic HTML (äèíàìè÷åñêèé ÿçûê HTML) — ýòî ïîïûòêà îáúåäèíèòü îáúåêòíóþ ìîäåëü äîêóìåíòà (Document Object Model, DOM), ÿçûê JavaScript è êàñêàäíûå ëèñòû ñòèëåé (CSS). Dynamic HTML ïîçâîëÿåò ñîçäàâàòü èíòåðàêòèâíûå âåá-ñòðàíèöû ñ ðàñøèðåííîé ïîääåðæêîé ìóëüòèìåäèà. Ìíîãèå ñðåäñòâà Dynamic HTML îïèñàíû â ñïåöèôèêàöèè HTML 4.01. ßçûê Java ïðîèçîøåë îò ÿçûêà ïðîãðàììèðîâàíèÿ Oak, îðèåíòèðîâàííîãî íà ðàáîòó â Èíòåðíåòå. Ñèíòàêñèñ ÿçûêà Java áëèçîê ê ñèíòàêñèñó ÿçûêà C++. Ïðîãðàììû íà ÿçûêå Java ìîæíî ðàçäåëèòü íà äâå áîëüøèå ãðóïïû. Ê ïåðâîé ãðóïïå îòíîñÿòñÿ Java-ïðèëîæåíèÿ, ïðåäíàçíà÷åííûå äëÿ àâòîíîìíîé ðàáîòû ïîä óïðàâëåíèåì ñïåöèàëüíîé èíòåðïðåòèðóþùåé ìàøèíû Java. Ðåàëèçàöèè ýòîé ìàøèíû ñîçäàíû äëÿ âñåõ îñíîâíûõ êîìïüþòåðíûõ ïëàòôîðì. Âòîðàÿ ãðóïïà — ýòî òàê íàçûâàåìûå àïïëåòû. Àïïëåò — ýòî íåáîëüøàÿ ïðîãðàììà, íàïèñàííàÿ íà ÿçûêå Java è âêëþ÷åííàÿ â ñîñòàâ HTML-ôàéëà. Ñðåäó äëÿ âûïîëíåíèÿ Java-àïïëåòîâ îáåñïå÷èâàåò äðóãàÿ ïðîãðàììà, íàïðèìåð âåá-áðàóçåð. Â îòëè÷èå îò ïðèëîæåíèé, àïïëåòû íå ìîãóò íåïîñðåäñòâåííî âûïîëíÿòüñÿ â îïåðàöèîííîé ñèñòåìå. Êîä àïïëåòà èíòåðïðåòèðóåòñÿ áðàóçåðîì èëè ñåðâåðîì. Â çàâèñèìîñòè îò òîãî, êàêàÿ èç ïðîãðàìì âûñòóïàåò â ðîëè èíòåðïðåòàòîðà, àïïëåòû ìîãóò âûïîëíÿòüñÿ íà ñòîðîíå êëèåíòà ëèáî íà ñòîðîíå ñåðâåðà. Java — ýòî êîìïèëèðóåìûé ÿçûê. JavaScript — ýòî ÿçûê ñöåíàðèåâ, ñ ïîìîùüþ êîòîðîãî ìîæíî ðàñøèðÿòü âîçìîæíîñòè HTML-ñòðàíèö. Ýòîò ÿçûê ðàçðàáàòûâàëñÿ êîðïîðàöèåé Netscape Communications äëÿ èñïîëüçîâàíèÿ â âåá-áðàóçåðå Netscape Navigator (JavaScript äëÿ êëèåíòà) è âåá-ñåðâåðíûõ ïðîäóêòàõ (JavaScript äëÿ ñåðâåðà), ñîçäàííûõ ýòîé êîðïîðàöèåé. Ìíîãèå ýëåìåíòû ýòîãî ÿçûêà, ïðåäíàçíà÷åííûå äëÿ ïîääåðæêè äîïîëíèòåëüíûõ ôóíêöèîíàëüíûõ âîçìîæíîñòåé ñòàòè÷åñêèõ âåá-ñòðàíèö, ðàçðàáîòàëà ôèðìà Sun Microsystem. Â îòëè÷èå îò Java-àïïëåòîâ, çàãðóæàåìûõ îòäåëüíî îò HTML-äîêóìåíòà, â êîòîðîì îíè èñïîëüçóþòñÿ, ïðîãðàììû, íàïèñàííûå íà ÿçûêå JavaScript, âñòðàèâàþòñÿ íåïîñðåäñòâåííî â HTML-äîêóìåíòû ñ ïîìîùüþ ïàðíîãî òåãà <SCRIPT>. Íåêîòîðûå íà÷èíàþùèå ïîëüçîâàòåëè ñ÷èòàþò, ÷òî JavaScript ÿâëÿåòñÿ âåðñèåé ÿçûêà Java. Ýòî êóðüåçíîå çàáëóæäåíèå, ìåæäó JavaScript è Java íåò íè÷åãî îáùåãî. Java — ýòî ÿçûê ïðîãðàììèðîâàíèÿ, à JavaScript — èíòåðïðåòèðóåìûé ÿçûê, ïðåäíàçíà÷åííûé äëÿ íàïèñàíèÿ ñöåíàðèåâ. VBScript — ÿçûê, êîòîðûé áûë ðàçðàáîòàí Microsoft êàê ïîäìíîæåñòâî ÿçûêà Visual Basic. VBScript ñîçäàâàëñÿ äëÿ ðàáîòû ñ Internet Explorer è Microsoft Internet Information Server. ColdFusion — ýòî íàáîð èíñòðóìåíòàëüíûõ ñðåäñòâ ðàçðàáîòêè âåá-ïðèëîæåíèé. Äîñòîèíñòâîì ýòîãî ïàêåòà ÿâëÿåòñÿ íàëè÷èå óäîáíûõ ñðåäñòâ äëÿ ðàáîòû ñ áàçàìè äàííûõ. PHP — ýòî ÿçûê ñöåíàðèåâ, îáðàáàòûâàåìûé ñåðâåðîì. Ïîäîáíî ColdFusion, PHPêîä íåïîñðåäñòâåííî âêëþ÷àåòñÿ â ñîñòàâ HTML-äîêóìåíòà. Íàçâàíèå PHP — ýòî àááðåâèàòóðà ïåðâîé âåðñèè ïðîãðàììû, êîòîðàÿ ïîëíîñòüþ íàçûâàëàñü

20

Ââåäåíèå

Personal Home Page Tools. Ïîçäíåå àááðåâèàòóðà PHP ñòàëà ðåêóðñèâíî ðàñøèôðîâûâàòüñÿ êàê «PHP Hypertext Preprocessor». Â PHP ðåàëèçîâàíû ëó÷øèå ðåøåíèÿ ìíîãèõ ÿçûêîâ, òàêèõ êàê C è Perl (Practical Extraction and Report Language), êðîìå òîãî, PHP ïðåäîñòàâëÿåò ðàçðàáîò÷èêó ìîùíûå ñðåäñòâà äëÿ ðàáîòû ñ áàçàìè äàííûõ. Ïîäîáíî Perl, PHP — ñâîáîäíî ðàñïðîñòðàíÿåìàÿ îòêðûòàÿ ñèñòåìà, è ñîîáùåñòâî ðàçðàáîò÷èêîâ èìååò âîçìîæíîñòü åå ìîäåðíèçèðîâàòü. Ê èçâåñòíûì ñðåäñòâàì ðàçðàáîòêè ìîæíî îòíåñòè òàêæå CGI (Common Gateway Interface), ASP, JSP (Java Server Pager), SSI (Server Side Includes), VRML (Virtual Reality Markup Language) è äðóãèå. Êàêèå ïðîãðàììû ëó÷øå èñïîëüçîâàòü äëÿ ñîçäàíèÿ âåá-ñòðàíèö? Ýòî, íåñîìíåííî, Adobe GoLive, Microsoft FrontPage, Macromedia Dreamweaver. Äëÿ ðåäàêòèðîâàíèÿ èçîáðàæåíèÿ ìîãóò ïðèìåíÿòüñÿ ïðîãðàììû Adobe Photoshop, Macromedia Fireworks, Corel Photo-Paint, Adobe Illustrator, Macromedia Freehand, Corel DRAW, Adobe LiveMotion, Macromedia Flash. Äëÿ ðàáîòû ñ àóäèî- è âèäåîäàííûìè — ïðîãðàììû Adobe Premier, Apple Final Cut Pro, Apple Quick Time, RealProducer, Windows Media. Ñóùåñòâóåò ìíîæåñòâî ïðîñòûõ è ñëîæíûõ ïðîãðàìì äëÿ íàïèñàíèÿ HTML-ñòðàíèö. Â ñâîåé îñíîâå âñå îíè äåëÿòñÿ íà äâå êàòåãîðèè: ïðîãðàììû, àâòîìàòèçèðóþùèå âñòàâêó òåãîâ, è îáûêíîâåííûå ñòàíäàðòíûå òåêñòîâûå ðåäàêòîðû è ïðîöåññîðû, ñîçäàííûå äëÿ ëþáûõ ïëàòôîðì. Õîòÿ âî ìíîãèõ ïåðå÷èñëåííûõ ïðîãðàììàõ âåá-ñòðàíèöû ñîçäàþòñÿ àâòîìàòè÷åñêè, ñëåäóåò îáÿçàòåëüíî ó÷èòü ÿçûê HTML, ÷òîáû ïîíèìàòü, êàê ñòðîèòñÿ âåá-ñòðàíèöà. Ïîýòîìó â äàííîé êíèãå ìû áóäåì ñîçäàâàòü âåá-ñòðàíèöû ñ ïîìîùüþ ïðîñòåéøåãî òåêñòîâîãî ðåäàêòîðà. Íå ñëåäóåò èñïîëüçîâàòü äëÿ ñîçäàíèÿ âåá-ñòðàíèö ïðîãðàììó Microsoft Word èëè Microsoft Power Point.

Â êíèãå ïîäðîáíî ðàññìîòðåíû ïðîöåññû îáðàáîòêè èçîáðàæåíèÿ äëÿ ðàçìåùåíèÿ íà âåá-ñòðàíèöàõ è îáùèå âîïðîñû âåá-äèçàéíà. Âñå âíèìàòåëüíî ÷èòàÿ, à ãëàâíîå, ñàìîñòîÿòåëüíî ââîäÿ âñå ïðèâîäèìûå â êíèãå êîäû âåá-ñòðàíèö, ìîæíî î÷åíü ñêîðî íàó÷èòüñÿ ðàçðàáàòûâàòü ñàéòû íà õîðîøåì óðîâíå.

Îò èçäàòåëüñòâà Âàøè çàìå÷àíèÿ, ïðåäëîæåíèÿ è âîïðîñû îòïðàâëÿéòå ïî àäðåñó ýëåêòðîííîé ïî÷òû [email protected] (èçäàòåëüñòâî «Ïèòåð», êîìïüþòåðíàÿ ðåäàêöèÿ). Ìû áóäåì ðàäû óçíàòü âàøå ìíåíèå! Ïîäðîáíóþ èíôîðìàöèþ î íàøèõ êíèãàõ âû íàéäåòå íà âåá-ñàéòå èçäàòåëüñòâà http://www.piter.com.

Óðîê 1 Îñíîâíûå ñâåäåíèÿ Â ýòîì óðîêå ðàññìàòðèâàþòñÿ îñíîâíûå ïîíÿòèÿ HTML è ýëåìåíòû âåá-ñòðàíèö. Äàíû îïðåäåëåíèÿ HTML, WWW, Èíòåðíåòà, âåá-ñàéòà. Ðàññêàçàíî, ñ ÷åãî ñëåäóåò íà÷èíàòü ïðè ñîçäàíèè HTML-äîêóìåíòà. Äàíû îïðåäåëåíèÿ òåãîâ, ãèïåðòåêñòà, ãèïåðòåêñòîâûõ ññûëîê, ïðèâåäåíû îñíîâíûå òåãè, îïðåäåëÿþùèå ñòðóêòóðó HTML-äîêóìåíòà.

22

Óðîê 1. Îñíîâíûå ñâåäåíèÿ

Îñíîâíûå ïîíÿòèÿ ßçûê HTML (HyperText Markup Language — ÿçûê ðàçìåòêè ãèïåðòåêñòà) ÿâëÿåòñÿ ñòàíäàðòíûì ÿçûêîì, ïðåäíàçíà÷åííûì äëÿ ñîçäàíèÿ ãèïåðòåêñòîâûõ äîêóìåíòîâ â ñðåäå WWW (World Wide Web — Âñåìèðíàÿ ïàóòèíà). HTMLäîêóìåíòû (èëè âåá-äîêóìåíòû) ìîãóò ïðîñìàòðèâàòüñÿ âåá-áðàóçåðàìè ðàçëè÷íûõ òèïîâ. Åñëè äîêóìåíò ñîçäàí ñ èñïîëüçîâàíèåì HTML, âåá-áðàóçåð ìîæåò èíòåðïðåòèðîâàòü HTML äëÿ âûäåëåíèÿ ðàçëè÷íûõ ýëåìåíòîâ äîêóìåíòà è ïåðâè÷íîé èõ îáðàáîòêè. Îñíîâíîå ïðåèìóùåñòâî HTML çàêëþ÷àåòñÿ â òîì, ÷òî äîêóìåíò ìîæåò áûòü ïðîñìîòðåí íà âåá-áðàóçåðàõ ðàçëè÷íûõ òèïîâ è íà ðàçëè÷íûõ ïëàòôîðìàõ. HTML — îäèí èç íàèáîëåå ïðîñòûõ ÿçûêîâ ñîçäàíèÿ âåá-ñòðàíèö. WWW — ýòî ñîîáùåñòâî âåá-ñåðâåðîâ (ñåòåâûõ êîìïüþòåðîâ), âõîäÿùèõ â Èíòåðíåò, íà êîòîðûõ õðàíÿòñÿ òåêñòîâûå, ãðàôè÷åñêèå, âèäåî-, àóäèî- è äðóãèå èíôîðìàöèîííûå ôàéëû. WWW — øèðîêîìàñøòàáíàÿ ãèïåðìåäèà-ñðåäà, îðèåíòèðîâàííàÿ íà ïðåäîñòàâëåíèå óíèâåðñàëüíîãî äîñòóïà ê îãðîìíîìó êîëè÷åñòâó äîêóìåíòîâ, ðàñïîëîæåííûõ íà ñåðâåðàõ. WWW — ðàñïðåäåëåííàÿ ñòðóêòóðà äàííûõ ñåòåâîãî ìóëüòèìåäèéíîãî ãèïåðòåêñòà. Ïî âñåìó ìèðó ðàçáðîñàíû òûñÿ÷è èíôîðìàöèîííûõ ñåðâåðîâ. Ëþáîé íîâûé êîìïüþòåð, ïîäêëþ÷åííûé ê Èíòåðíåòó, ìîæåò ñàì ñòàòü ñåðâåðîì, ïîëó÷àòü íåîáõîäèìóþ èíôîðìàöèþ îò äðóãèõ ñåðâåðîâ, îòïðàâëÿòü ïèñüìà è ïîëó÷àòü îòâåòû ñ ïîìîùüþ ëþáîé èç ìíîãî÷èñëåííûõ ïî÷òîâûõ ñëóæá. Ïîèñêîâûå ñåðâåðû õðàíÿò ìèëëèîíû ññûëîê íà ðàçíîîáðàçíûå äîêóìåíòû è ïðîèçâîäÿò ïîèñê íóæíîé èíôîðìàöèè ïî çàïðîñó ïîëüçîâàòåëÿ. Ãëîáàëüíûé ïîèñê ýëåêòðîííûõ ïóáëèêàöèé ïðîâîäèòñÿ ñ èñïîëüçîâàíèåì òåõíîëîãèé WWW. Ïîìèìî èçâåñòíûõ àíãëîÿçû÷íûõ è ðóññêîÿçû÷íûõ ïîèñêîâûõ ñèñòåì, ðàñïîëîæåííûõ íà êðóïíûõ ñåðâåðàõ, ñîáñòâåííûå ñåðâåðû èìåþò èíôîðìàöèîííûå àãåíòñòâà, èçäàòåëüñòâà, áàíêè è äðóãèå îðãàíèçàöèè. Èíòåðíåò — ýòî ñîâîêóïíîñòü ñåòåé, ïðèìåíÿþùèõ åäèíûé ïðîòîêîë îáìåíà (òî÷íåå, îáøèðíîå ñåìåéñòâî èç ñîòåí ïðîòîêîëîâ) äëÿ ïåðåäà÷è èíôîðìàöèè. Âåá-ñàéò (web site) — ñîâîêóïíîñòü âåá-äîêóìåíòîâ, îðãàíèçîâàííûõ â âèäå òèòóëüíîé ñòðàíèöû è íåñêîëüêèõ ñâÿçàííûõ ñ íåé ñòðàíèö. Êàæäàÿ òàêàÿ ñîâîêóïíîñòü, äîñòóïíàÿ â Èíòåðíåòå, ìîæåò èìåòü ëþáûå ðàçìåð è ñîäåðæàíèå, èíôîðìàöèîííóþ è ýìîöèîíàëüíóþ íàïðàâëåííîñòü. Âåá-ìàñòåð — ëèöî, îòâåòñòâåííîå çà ïîääåðæàíèå è îáíîâëåíèå äîêóìåíòîâ íà âåá-ñåðâåðàõ. Êàê ñîçäàþòñÿ HTML-äîêóìåíòû? HTML-äîêóìåíòû ìîãóò áûòü ñîçäàíû ïðè ïîìîùè ëþáûõ òåêñòîâûõ ðåäàêòîðîâ èëè ñïåöèàëèçèðîâàííûõ HTML-ðåäàêòîðîâ è êîíâåðòåðîâ. HTML-äîêóìåíò — ýòî îáû÷íûé ôàéë â ôîðìàòå ASCII. Â åãî îñíîâå ëåæàò ñïåöèàëüíûå äåñêðèïòîðû (òåãè), êîòîðûå è îïðåäåëÿþò ïðàâèëà ôîðìàòèðîâàíèÿ äàííûõ.

Îñíîâíûå ïîíÿòèÿ

23

Êîä ïðîãðàììû íà ÿçûêå HTML — îáû÷íûé òåêñòîâûé ôàéë, ïîýòîìó ïðîùå âñåãî íàïèñàòü åãî â Áëîêíîòå — ñòàíäàðòíîì Windows-ïðèëîæåíèè, êîòîðîå âûçûâàåòñÿ êîìàíäîé Ïóñê4Ïðîãðàììû4Ñòàíäàðòíûå4Áëîêíîò. Ïðèìåð ïðîãðàììû, íàïèñàííîé íà ÿçûêå HTML â Áëîêíîòå, ïîêàçàí íà ðèñ. 1.1.

Ðèñ. 1.1. Ïðèìåð ïðîãðàììû, íàïèñàííîé íà ÿçûêå HTML â Áëîêíîòå

Êîãäà ïðîãðàììà íàïèñàíà, åå ôàéë ñëåäóåò ñîõðàíèòü íå ñ ðàñøèðåíèåì .txt, à ñ ðàñøèðåíèåì .htm (ðèñ. 1.2). Èìÿ HTML-ôàéëà ñëåäóåò ïèñàòü ñòðî÷íûìè ëàòèíñêèìè áóêâàìè áåç ïðîáåëîâ. Ìîæíî èñïîëüçîâàòü öèôðû, çíàêè ïîä÷åðêèâàíèÿ è òèðå.

Ðèñ. 1.2. Äèàëîãîâîå îêíî ñîõðàíåíèÿ ôàéëà â ïðîãðàììå Áëîêíîò

24

Óðîê 1. Îñíîâíûå ñâåäåíèÿ

Êàê òîëüêî ôàéë áóäåò çàïèñàí ñ ðàñøèðåíèåì .htm, åãî çíà÷îê ñðàçó ïðèìåò âèä «èíòåðíåòîâñêîãî», ÷òî ïîêàçàíî íà ðèñ. 1.3. Ôàéë ñ ðàñøèðåíèåì .htm ìîæíî ïðîñìîòðåòü â ïðîãðàììå Internet Explorer.

Ðèñ. 1.3. Ïðèìåðû çíà÷êîâ TXT- è HTML-ôàéëîâ

HTML — ýòî ÿçûê òåãîâ. Ïîä òåãàìè ïîíèìàþòñÿ ñïåöèàëüíûå óïðàâëÿþùèå êîäû, çàïèñûâàåìûå â òåêñòå â óãëîâûõ ñêîáêàõ. Òåãè, îêðóæàþùèå òåêñòîâûå èëè ãðàôè÷åñêèå êîìàíäû, îïðåäåëÿþò ïàðàìåòðû ôîðìàòèðîâàíèÿ òåêñòà, ìåñòîïîëîæåíèå ðèñóíêîâ îòíîñèòåëüíî òåêñòà, ðàñïîëîæåíèå îáúåêòîâ íà ñòðàíèöå. Âñå HTML-òåãè íà÷èíàþòñÿ ñ ñèìâîëà ëåâîé óãëîâîé ñêîáêè (<) è çàêàí÷èâàþòñÿ ñèìâîëîì ïðàâîé óãëîâîé ñêîáêè (>). Êàê ïðàâèëî, ñóùåñòâóþò îòêðûâàþùèé è çàêðûâàþùèé òåãè. Äëÿ ïðèìåðà ïðèâåäåì îòêðûâàþùèé è çàêðûâàþùèé òåãè, îïðåäåëÿþùèå çàãîëîâîê äîêóìåíòà: <TITLE> Çàãîëîâîê äîêóìåíòà

Èòàê, òåã — ïîñëåäîâàòåëüíîñòü ñèìâîëîâ, çàêëþ÷åííûõ ìåæäó ñèìâîëàìè < è >. Ïî÷òè âñå òåãè îáðàçóþò ïàðû, òî åñòü äëÿ îòêðûâàþùåãî òåãà ñóùåñòâóåò çàêðûâàþùèé òåã. Åñòü è íåïàðíûå òåãè, íàïðèìåð
, , íî èõ ìàëî. Çàêðûâàþùèé òåã âûãëÿäèò òàê æå, êàê îòêðûâàþùèé, è îòëè÷àåòñÿ îò íåãî ñèìâîëîì ïðÿìîãî ñëýøà ïåðåä òåêñòîì âíóòðè óãëîâûõ ñêîáîê. Â äàííîì ïðèìåðå òåã <TITLE> ãîâîðèò âåá-áðàóçåðó îá èñïîëüçîâàíèè ôîðìàòà çàãîëîâêà, à òåã — î çàâåðøåíèè òåêñòà çàãîëîâêà. Íåêîòîðûå òåãè, òàêèå êàê

(òåã, îïðåäåëÿþùèé àáçàö), íå òðåáóþò çàâåðøàþùåãî òåãà, íî åãî íàëè÷èå ïðèäàåò èñõîäíîìó òåêñòó äîêóìåíòà ñòðîéíîñòü, äåëàåò åãî ïîíÿòíåå. ßçûê HTML íå÷óâñòâèòåëåí ê ðåãèñòðó ñèìâîëîâ, îïèñûâàþùèõ òåã, è ïðèâåäåííûé ðàíåå ïðèìåð ìîã áû âûãëÿäåòü ñëåäóþùèì îáðàçîì: Çàãîëîâîê äîêóìåíòà

Äîïîëíèòåëüíûå ïðîáåëû, ñèìâîëû òàáóëÿöèè è êîíöà ñòðîêè, äîáàâëåííûå â èñõîäíûé òåêñò HTML-äîêóìåíòà, ÷òîáû ñäåëàòü åãî ïîíÿòíåå, èãíîðèðóþòñÿ âåá-áðàóçåðîì ïðè èíòåðïðåòàöèè äîêóìåíòà. HTML-äîêóìåíò ìîæåò âêëþ÷àòü âûøåîïèñàííûå ýëåìåíòû, òîëüêî åñëè îíè ïîìåùåíû âíóòðü òåãîâ

è

(áîëåå ïîäðîáíî î òåãå

ðàññêàçûâàåòñÿ â óðîêå 2). Âñÿ ïðîãðàììà ñîñòîèò èç íàáîðà òåãîâ. Òåãè ìîãóò èìåòü ïàðàìåòðû, èëè àòðèáóòû, êîòîðûå èãðàþò ðîëü äîïîëíåíèÿ òåãîâ. Èíîãäà òåãè íàçûâàþò äåñêðèïòîðàìè. Äåñêðèïòîð (â ïåðåâîäå ñ ëàò. îïèñàòåëü) — ëåêñè÷åñêàÿ åäèíèöà (ñëîâî, ñëîâîñî÷åòàíèå) èíôîðìàöèîííî-ïîèñêîâîãî ÿçûêà, âûðàæàþùàÿ îñíîâíîå ñìûñëîâîå ñîäåðæàíèå êàêîãî-ëèáî òåêñòà. Äåñêðèïòîð èñïîëüçóåòñÿ ïðè èíôîðìàöèîííîì ïîèñêå äîêóìåíòîâ â èíôîðìàöèîííî-ïîèñêîâûõ ñèñòåìàõ.

Ñòðóêòóðà äîêóìåíòà

Áðàóçåð Äëÿ ïðîñìîòðà HTML-äîêóìåíòîâ â WWW íåîáõîäèìî ñïåöèàëüíîå ïðîãðàììíîå îáåñïå÷åíèå. Òàêèå ïðîãðàììû íàçûâàþòñÿ áðàóçåðàìè (îò àíãë. browse — ëèñòàòü, ïðîñìàòðèâàòü, ÷èòàòü). Ñ èõ ïîìîùüþ ìîæíî çàãðóæàòü è ïðîñìàòðèâàòü âåá-ñòðàíèöû, îñóùåñòâëÿòü íàâèãàöèþ â WWW è ò. ä. Áðàóçåð — ïðîãðàììà ïðîñìîòðà HTML-ôàéëîâ, ïðîãðàììà-èíòåðïðåòàòîð ÿçûêà HTML. Áðàóçåð ïîêàçûâàåò íà ýêðàíå òåêñò è ãðàôèêó, èíòåðïðåòèðóÿ êîìàíäû (òåãè), óêàçàííûå â èñõîäíîì òåêñòå â óãëîâûõ ñêîáêàõ. Âåá-áðàóçåð — ýòî ïðèêëàäíàÿ ïðîãðàììà, êîòîðàÿ îòîáðàæàåò ñîäåðæèìîå ôàéëîâ, ïîëó÷åííûõ ñ ëîêàëüíîãî èëè óäàëåííîãî êîìïüþòåðà, â ñîîòâåòñòâèè ñ èíñòðóêöèÿìè, âêëþ÷åííûìè â ýòè ôàéëû. Áðàóçåð ïðåäñòàâëÿåò ñîáîé êëèåíòñêóþ ïðîãðàììó è èñïîëüçóåò äëÿ ïåðåäà÷è çàïðîñîâ âåá-ñåðâåðàì ïðîòîêîë HTTP (HyperText Transfer Protocol — ïðîòîêîë ïåðåäà÷è ãèïåðòåêñòà). Ñóùåñòâóåò äîâîëüíî áîëüøîå êîëè÷åñòâî áðàóçåðîâ, èç êîòîðûõ ñàìûìè ïîïóëÿðíûìè ÿâëÿþòñÿ áðàóçåðû Microsoft Internet Explorer, Netscape Navigator è Mozill è Firefox. Áðàóçåð, ïðî÷èòàâ HTML-ôàéë, ñ ïîìîùüþ òåãîâ èíòåðïðåòèðóåò ñîäåðæàùèåñÿ â äîêóìåíòå äàííûå è ñîîòâåòñòâóþùèì îáðàçîì îòîáðàæàåò èõ íà ýêðàíå êîìïüþòåðà. Áðàóçåðû Netscape Navigator è Internet Explorer èìåþò âñòðîåííûå ïðîãðàììû ÷òåíèÿ íîâîñòåé.

Ñòðóêòóðà äîêóìåíòà Êîãäà âåá-áðàóçåð ïîëó÷àåò äîêóìåíò, îí ïî òåãàì îïðåäåëÿåò, êàê äîêóìåíò äîëæåí áûòü èíòåðïðåòèðîâàí. m Òåã . Ñàìûé ïåðâûé òåã, êîòîðûé âñòðå÷àåòñÿ â äîêóìåíòå, äîëæåí áûòü òåãîì . Äàííûé òåã ñîîáùàåò âåá-áðàóçåðó, ÷òî äîêóìåíò íàïèñàí íà ÿçûêå HTML. Ìèíèìàëüíûé HTML-äîêóìåíò ìîã áû âûãëÿäåòü òàê: ...òåëî äîêóìåíòà...

Òàêèì îáðàçîì, òåãè è îáðàçóþò äëÿ HTML-äîêóìåíòà òàê íàçûâàåìûé êîíòåéíåð. m Òåã . Ñòðóêòóðíî äîêóìåíò ðàñïàäàåòñÿ íà äâå ÷àñòè: çàãîëîâî÷íóþ è îñíîâíóþ, èëè òåëî äîêóìåíòà. Çàãîëîâî÷íàÿ ÷àñòü ðàçìåùàåòñÿ ìåæäó òåãàìè è , îñíîâíàÿ — ìåæäó òåãàìè è . m Òåã <TITLE>. Âíóòðè êîíòåéíåðà è ðàçìåùàåòñÿ åäèíñòâåííûé îáÿçàòåëüíûé êîíòåéíåð èç òåãîâ <TITLE> è , ñîäåðæàùèé òåêñò çàãîëîâêà. Òåã çàãîëîâî÷íîé ÷àñòè äîêóìåíòà äîëæåí áûòü óêàçàí ñðàçó ïîñëå òåãà è áîëåå íèãäå â òåëå äîêóìåíòà. Äàííûé òåã ïðåäñòàâëÿåò ñîáîé îáîáùåííîå îïèñàíèå äîêóìåíòà. Ñëåäóåò èçáåãàòü ðàçìåùåíèÿ êàêîãî-ëèáî òåêñòà âíóòðè òåãà . Îòêðûâàþùèé òåã óêàçûâàåòñÿ íåïîñðåäñòâåííî ïåðåä òåãîì <TITLE> è äðóãèìè òåãàìè, îïèñûâàþùèìè äîêóìåíò, à çàêðûâàþùèé òåã — ñðàçó ïîñëå îêîí÷àíèÿ îïèñàíèÿ äîêóìåíòà.

Óðîê 1. Îñíîâíûå ñâåäåíèÿ

Áîëüøèíñòâî âåá-áðàóçåðîâ îòîáðàæàþò ñîäåðæèìîå òåãà <TITLE> â çàãîëîâêå îêíà, ñîäåðæàùåãî äîêóìåíò, è â ôàéëå çàêëàäîê, åñëè îí ïîääåðæèâàåòñÿ âåááðàóçåðîì. Çàãîëîâîê, îãðàíè÷åííûé òåãàìè <TITLE> è , ðàçìåùàåòñÿ âíóòðè òåãîâ . Çàãîëîâîê äîêóìåíòà ïðè îòîáðàæåíèè ñàìîãî äîêóìåíòà â îêíå áðàóçåðà íå âèäåí. Òåãè òåëà äîêóìåíòà èäåíòèôèöèðóþò îòîáðàæàåìûå â îêíå êîìïîíåíòû HTML-äîêóìåíòà. Òåëî äîêóìåíòà ìîæåò ñîäåðæàòü ññûëêè íà äðóãèå äîêóìåíòû, òåêñò è äðóãóþ ôîðìàòèðîâàííóþ èíôîðìàöèþ. m Òåã . Òåëî äîêóìåíòà äîëæíî íàõîäèòüñÿ ìåæäó òåãàìè è . Ýòî òà ÷àñòü äîêóìåíòà, êîòîðàÿ îòîáðàæàåò åãî òåêñòîâóþ è ãðàôè÷åñêóþ èíôîðìàöèþ. Ñëåäóåò çàìåòèòü ÷òî îòêðûâàþùèå è çàêðûâàþùèå òåãè , è íåîáÿçàòåëüíû, íî èõ íàñòîÿòåëüíî ðåêîìåíäóåòñÿ èñïîëüçîâàòü, ïîñêîëüêó ýòî ïîçâîëÿåò âåá-áðàóçåðó óâåðåííî îòäåëèòü äðóã îò äðóãà çàãîëîâî÷íóþ è íåïîñðåäñòâåííî ñìûñëîâóþ ÷àñòè äîêóìåíòà. Òåã ïàðíûé. Ìåæäó îòêðûâàþùèì òåãîì è çàêðûâàþùèì òåãîì ðàçìåùàþòñÿ âñå äðóãèå òåãè ïðîãðàììû, ñîñòàâëÿþùèå îñíîâíîå ñîäåðæàíèå äîêóìåíòà. Òåã ïðåäíàçíà÷àåòñÿ äëÿ âûäåëåíèÿ òîé ÷àñòè äîêóìåíòà, êîòîðàÿ äîëæíà áûòü ïîêàçàíà ïîëüçîâàòåëþ íà ýêðàíå.

Ãèïåðòåêñòîâûå ññûëêè Ãèïåðòåêñòîâûå ññûëêè ÿâëÿþòñÿ êëþ÷åâûì êîìïîíåíòîì, äåëàþùèì âåáñòðàíèöû ïðèâëåêàòåëüíûìè äëÿ ïîëüçîâàòåëåé. Áëàãîäàðÿ ãèïåðòåêñòîâûì ññûëêàì (èëè ïðîñòî ãèïåðññûëêàì) âåá-ñòðàíèöà ñòðóêòóðèðóåòñÿ è ñâÿçûâàåòñÿ ñ äðóãèìè äîêóìåíòàìè, ÷òî îáåñïå÷èâàåò áûñòðîå è óäîáíîå ïîëó÷åíèå èíôîðìàöèè. Òåõíîëîãèÿ ãèïåðññûëîê ïîçâîëÿåò îáúåäèíèòü ìíîæåñòâî äîêóìåíòîâ â îäèí. Ãèïåðòåêñò — èíôîðìàöèîííàÿ ñòðóêòóðà, îáåñïå÷èâàþùàÿ íàâèãàöèþ ïîñðåäñòâîì ãèïåðòåêñòîâûõ ññûëîê. Ãèïåðòåêñòîâûìè ññûëêàìè íàçûâàþòñÿ ôðàãìåíòû òåêñòà èëè èçîáðàæåíèÿ, ïðè àêòèâèçàöèè êîòîðûõ îòîáðàæàþòñÿ ñâÿçàííûå ñ íèìè äîêóìåíòû. Ãèïåðòåêñòîâàÿ ññûëêà — îñíîâíîé ýëåìåíò âñåõ ãèïåðòåêñòîâûõ ñèñòåì, êîòîðûå óêàçûâàþò íà äðóãîé äîêóìåíò èëè íà äðóãóþ ÷àñòü òîãî æå äîêóìåíòà. Òàêàÿ ññûëêà çàäàåòñÿ òåãàìè è . Îíà èìååò íåñêîëüêî àòðèáóòîâ, íàëè÷èå îäíîãî èç äâóõ (HREF èëè NAME) îáÿçàòåëüíî. Ïåðâûé óêàçûâàåò íà ññûëêó çà ïðåäåëû äàííîãî äîêóìåíòà, íàïðèìåð: íàçâàíèå ññûëêè

Âòîðîé ïîçâîëÿåò ïåðåéòè ê îïðåäåëåííûì îáðàçîì îòìå÷åííîìó (ñ ïîìîùüþ òàê íàçûâàåìîãî ÿêîðÿ, èëè çàêëàäêè) ìåñòó òîãî æå ñàìîãî äîêóìåíòà, íàïðèìåð: íàçâàíèå ññûëêè

Ññûëêè èìåþò ñòàíäàðòíûé ôîðìàò, ÷òî ïîçâîëÿåò áðàóçåðó èíòåðïðåòèðîâàòü èõ è âûïîëíÿòü íåîáõîäèìûå ôóíêöèè (âûçûâàòü ìåòîäû) â çàâèñèìîñòè îò

Èçìåíåíèå ïðîãðàììû

òèïà ññûëêè. Ññûëêè ìîãóò óêàçûâàòü íà äðóãîé äîêóìåíò, ñïåöèàëüíîå ìåñòî äàííîãî äîêóìåíòà èëè âûïîëíÿòü äðóãèå ôóíêöèè, íàïðèìåð çàïðàøèâàòü ôàéë ïî ïðîòîêîëó FTP (File Transfer Protocol — ïðîòîêîë ïåðåäà÷è ôàéëîâ) äëÿ îòîáðàæåíèÿ åãî áðàóçåðîì. Â ññûëêó âêëþ÷àåòñÿ URL (Uniform Resource Locator — óíèôèöèðîâàííûé óêàçàòåëü ðåñóðñà) — àäðåñ îñîáîãî ôîðìàòà, èäåíòèôèöèðóþùèé äðóãèå ëîêàëüíûå èëè óäàëåííûå äîêóìåíòû, ÷òî ÷àñòî òðåáóåòñÿ ïðè îðãàíèçàöèè áîëüøèõ ñòðóêòóðèðîâàííûõ âåá-ñàéòîâ. Ññûëêè ìîæíî èñïîëüçîâàòü äëÿ ïåðåìåùåíèÿ êàê ïî îäíîìó äîêóìåíòó, òàê è îò îäíîãî äîêóìåíòà ê äðóãîìó. Îäíàêî HTML íå ïîääåðæèâàåò âîçâðàò íà ïðåäûäóùóþ ññûëêó, åñëè ïåðåìåùåíèå ïðîèñõîäèò âíóòðè äîêóìåíòà.

Èçìåíåíèå ïðîãðàììû Åñëè â êîäå âåá-äîêóìåíòà (ôàéëå ñ ðàñøèðåíèåì .htm), êîòîðûé ìîæíî ïðîñìîòðåòü â áðàóçåðå Internet Explorer, òðåáóåòñÿ âûïîëíèòü èçìåíåíèÿ, òî ñëåäóåò îòêðûòü ýòîò ôàéë â ïðîãðàììå Áëîêíîò, âûáðàâ â áðàóçåðå Internet Explorer êîìàíäó Âèä4Ïðîñìîòð HTML-êîäà (ðèñ. 1.4).

Ðèñ. 1.4. Ïðîñìîòð HTML-êîäà äîêóìåíòà

HTML-ôàéë áóäåò îòêðûò â îêíå ïðîãðàììû Áëîêíîò (ñì. ðèñ. 1.1). Âûïîëíèâ èçìåíåíèÿ êîäà ïðîãðàììû, ñëåäóåò âîñïîëüçîâàòüñÿ êîìàíäîé Ôàéë4Ñîõðàíèòü (ðèñ. 1.5).

Ðèñ. 1.5. Ñîõðàíåíèå ïðîãðàììû

Óðîê 1. Îñíîâíûå ñâåäåíèÿ

×òîáû óâèäåòü èçìåíåíèÿ ïðîãðàììû â áðàóçåðå Internet Explorer, íåîáõîäèìî ùåëêíóòü íà êíîïêå Îáíîâèòü (îíà ÷åòâåðòàÿ ñëåâà íà ðèñ. 1.6) èëè âûïîëíèòü êîìàíäó Âèä4Îáíîâèòü (ñì. ðèñ. 1.4).

Ðèñ. 1.6. Ïàíåëü èíñòðóìåíòîâ ïðîãðàììû Internet Explorer

Ïðè ñëåäóþùèõ èçìåíåíèÿõ âñå ïåðå÷èñëåííûå îïåðàöèè ñëåäóåò ïîâòîðèòü.

Òåãè è àòðèáóòû Òåã — êîä ÿçûêà HTML, ñ ïîìîùüþ êîòîðîãî âûïîëíÿåòñÿ ðàçìåòêà èñõîäíîãî òåêñòà. Òåã çàïèñûâàåòñÿ â óãëîâûõ ñêîáêàõ. Êàê óæå îòìå÷àëîñü, âñå òåãè íà÷èíàþòñÿ ñ ñèìâîëà < è çàêàí÷èâàþòñÿ ñèìâîëîì >. Ïîñëå îòêðûâàþùåé óãëîâîé ñêîáêè ñëåäóåò èìÿ òåãà (êîìàíäû). Êàæäûé òåã ìîæåò èìåòü àòðèáóòû. Ïîñëå ïåðå÷èñëåíèÿ âñåõ àòðèáóòîâ íà÷àëüíûé, èëè îòêðûâàþùèé, òåã çàêðûâàåòñÿ. Ïîñëå îòêðûâàþùåãî òåãà ðàñïîëàãàåòñÿ ñîäåðæèìîå òåãà. Êîä HTML-äîêóìåíòà çàêàí÷èâàåòñÿ êîíå÷íûì, èëè çàêðûâàþùèì, òåãîì (ðèñ. 1.7). Çàêðûâàþùèå òåãè íà÷èíàþòñÿ ñ ñèìâîëà êîñîé ÷åðòû (/).

Ðèñ. 1.7. Ñòðóêòóðà HTML-ýëåìåíòà

Ïðè íàïèñàíèè òåãîâ íå ó÷èòûâàåòñÿ ðåãèñòð áóêâ, òî åñòü êîä ìîæåò áûòü íàïèñàí êàê ñòðî÷íûìè, òàê è ïðîïèñíûìè áóêâàìè, íî â îñíîâíîì èñïîëüçóþò ïðîïèñíûå, ÷òîáû îòëè÷àòü òåãè îò èíôîðìàöèîííîãî íàïîëíåíèÿ äîêóìåíòà. Åñëè òåã íàïèñàí ñ îøèáêîé, òî ïðîãðàììà åãî èãíîðèðóåò, íå ñîîáùàÿ îá îøèáêå. Òåãè íå îòîáðàæàþòñÿ ñàìè, à âëèÿþò íà ñïîñîá îòîáðàæåíèÿ äîêóìåíòà. Àòðèáóòû — äîïîëíèòåëüíûå óïðàâëÿþùèå ñëîâà, îòäåëåííûå îò òåãà è äðóã îò äðóãà ïðîáåëàìè. Ìîæíî ñêàçàòü, ÷òî àòðèáóòû — ýòî èìåíà ñâîéñòâ òåãîâ, êîòîðûå ìîãóò ïðèíèìàòü îïðåäåëåííûå çíà÷åíèÿ. Àòðèáóòû èìåþòñÿ òîëüêî ó îòêðûâàþùèõ òåãîâ, ó çàêðûâàþùèõ òåãîâ èõ íåò. Àòðèáóòû âëèÿþò íà ðåçóëüòàò èíòåðïðåòàöèè òåãà áðàóçåðîì. Íåêîòîðûå àòðèáóòû èìåþò êîíêðåòíîå çíà÷åíèå, êîòîðîå çàäàåòñÿ ïîñëå çíàêà ðàâåíñòâà. Ðàíüøå çíà÷åíèÿ àòðèáóòà òðåáîâàëîñü çàêëþ÷àòü â êàâû÷êè, íî òåïåðü âî ìíîãèõ ñëó÷àÿõ ýòè êàâû÷êè ìîæíî îïóñêàòü áåç êàêèõ-ëèáî ïîñëåäñòâèé.

Àòðèáóòû òåãà

Îñíîâíûå ïðàâèëà ñîçäàíèÿ âåá-ñòðàíèö Ïðè ñîçäàíèè âåá-ñòðàíèöû íåîáõîäèìî ïðèäåðæèâàòüñÿ îïðåäåëåííûõ ïðàâèë, êîòîðûå ïåðå÷èñëåíû íèæå. m Ñëåäèòå çà òåì, ÷òîáû âåá-ñòðàíèöû íå ïîëó÷èëèñü ñëèøêîì øèðîêèìè è ïîëüçîâàòåëÿì íå ïðèõîäèëîñü ïîëüçîâàòüñÿ ïðîêðóòêîé. Îáû÷íî, åñëè âåá-ñòðàíèöà íå ïîìåùàåòñÿ íà ýêðàíå, áîëüøèíñòâî áðàóçåðîâ äîáàâëÿþò âíèçó ýêðàíà ãîðèçîíòàëüíóþ ïîëîñó ïðîêðóòêè. Òèïè÷íîé øèðèíîé ýêðàíà ñ÷èòàåòñÿ øèðèíà 640 ïèêñåëîâ. m Êàæäàÿ âåá-ñòðàíèöà äîëæíà èìåòü çàãîëîâîê. m Íå ïåðåãðóæàéòå ñòðàíèöó ãðàôèêîé. m Ïîïûòêà âèçóàëüíî âûäåëèòü âñå îçíà÷àåò íå âûäåëèòü íè÷åãî. m Íå çàáûâàéòå æèòåéñêóþ ìóäðîñòü: «Âñå ãåíèàëüíîå — ïðîñòî». m Ïîìíèòå ïðî ïîñëîâèöó: «Âûïëåñêèâàÿ âîäó èç êîðûòà, íå âûïëåñíèòå ñ âîäîé ðåáåíêà». Èíîãäà âåá-ñòðàíèöà ñäåëàíà òàê êðàñèâî è îðèãèíàëüíî, ÷òî íåïîíÿòíî, ÷åìó îíà ïîñâÿùåíà. m Èñïîëüçóéòå ñâîáîäíîå ïðîñòðàíñòâî äëÿ ïðèâëå÷åíèÿ âíèìàíèÿ. Ìíîãèå ñîçäàòåëè ñàéòîâ êîíöåíòðèðóþò òåêñò â ñåðåäèíå ýêðàíà, îñòàâëÿÿ øèðîêèå ïîëÿ ñëåâà è ñïðàâà îò òåêñòà ïóñòûìè. Ïîäîáíîå ïóñòîå ïðîñòðàíñòâî çàñòàâëÿåò ïîëüçîâàòåëåé êîìïüþòåðà ñîñðåäîòî÷èòüñÿ íà òåêñòå, êîòîðûé íàõîäèòñÿ â ñåðåäèíå.

Àòðèáóòû òåãà Â ïðîòèâîïîëîæíîñòü òåãó òåã ñîäåðæèò âñþ òó èíôîðìàöèþ, èç êîòîðîé, ñîáñòâåííî, è ñîñòîèò ðàññìàòðèâàåìûé äîêóìåíò. Ïîðÿäîê ñëåäîâàíèÿ òåãîâ çäåñü èìåííî òàêîé, â êàêîì îíè ïðåäñòàþò ïåðåä ÷èòàòåëåì. Íà÷àëüíûé òåã ìîæåò èìåòü íåñêîëüêî àòðèáóòîâ, íàïðèìåð:

m Àòðèáóò BACKGROUND çàäàåò ãðàôè÷åñêîå èçîáðàæåíèå, êîòîðîå, êàê êàôåëüíàÿ ïëèòêà, çàïîëíèò ôîí äîêóìåíòà. Ôàéë ñ èçîáðàæåíèåì äîëæåí áûòü ñîõðàíåí â ôîðìàòå GIF èëè JPEG. Ïðèìåð:

Ôàéë ñ èçîáðàæåíèåì ôîíà ëó÷øå ðàçìåùàòü â òîì æå êàòàëîãå, ÷òî è ôàéë ñàìîãî äîêóìåíòà, òîãäà URL-àäðåñ è ïóòü óêàçûâàòü íå íóæíî. Ïðèìåð èñïîëüçîâàíèÿ ýòîãî àòðèáóòà â HTML-äîêóìåíòå èìååòñÿ â óðîêå 4. m Àòðèáóò BGCOLOR çàäàåò öâåò ôîíà äîêóìåíòà ïðè ïîìîùè øåñòíàäöàòåðè÷íûõ çíà÷åíèé èíòåíñèâíîñòè öâåòîâîé ìîäåëè RGB (Red, Green, Blue — êðàñíûé, çåëåíûé, ñèíèé) èëè ñòðî÷íîãî ëèòåðàëà, ñîîòâåòñòâóþùåãî íàçâàíèþ öâåòà, íàïðèìåð:

Óðîê 1. Îñíîâíûå ñâåäåíèÿ

Ïðèìåðû èñïîëüçîâàíèÿ ýòîãî àòðèáóòà â HTML-äîêóìåíòå èìåþòñÿ â óðîêå 2. m Àòðèáóò TEXT çàäàåò èñïîëüçóåìûé ïî óìîë÷àíèþ öâåò òåêñòà, íå ÿâëÿþùåãîñÿ ãèïåðññûëêîé. Ïî óìîë÷àíèþ òàêîé òåêñò ÷åðíûé. Ïðèìåð:

Ïðèìåð èñïîëüçîâàíèÿ ýòîãî àòðèáóòà â HTML-äîêóìåíòå èìååòñÿ â óðîêå 4. m Àòðèáóò LINK çàäàåò öâåò ãèïåðññûëêè; â áîëüøèíñòâå áðàóçåðîâ îí ïî óìîë÷àíèþ òåìíî-ñèíèé. Ïðèìåð:

Ïðèìåð èñïîëüçîâàíèÿ ýòîãî àòðèáóòà â HTML-äîêóìåíòå èìååòñÿ â óðîêå 15. m Àòðèáóò ALINK çàäàåò öâåò àêòèâíîé ãèïåðññûëêè, êîòîðûé ìåíÿåòñÿ â ìîìåíò ùåë÷êà íà íåé ìûøüþ è êîòîðûé æåëàòåëüíî äåëàòü îòëè÷íûì îò öâåòà ôîíà (çàäàâàåìîãî àòðèáóòîì LINK). Ïðèìåð:

Ïðèìåð èñïîëüçîâàíèÿ ýòîãî àòðèáóòà â HTML-äîêóìåíòå èìååòñÿ â óðîêå 15. m Àòðèáóò VLINK çàäàåò öâåò ïîñåùåííîé ãèïåðññûëêè, êîòîðûé æåëàòåëüíî äåëàòü îòëè÷íûì îò öâåòà ôîíà (çàäàâàåìîãî àòðèáóòîì LINK) è îò öâåòà àêòèâíîé ãèïåðññûëêè (çàäàâàåìîãî àòðèáóòîì ALINK). Ïðèìåð:

Ïðèìåð èñïîëüçîâàíèÿ ýòîãî àòðèáóòà â HTML-äîêóìåíòå èìååòñÿ â óðîêå 15. m Àòðèáóò BGPROPERTIES çàäàåò ñâîéñòâà ôîíîâîãî èçîáðàæåíèÿ. Â äàííûé ìîìåíò áðàóçåðàìè ïîääåðæèâàåòñÿ åäèíñòâåííîå åãî çíà÷åíèå fixed, çàïðåùàþùåå ïðîêðóòêó èçîáðàæåíèÿ. Ïðèìåð:

m Àòðèáóò TOPMARGIN çàäàåò âåðõíþþ ãðàíèöó ñòðàíèöû â ïèêñåëàõ. Ïðèìåð:

m Àòðèáóò BOTTOMMARGIN çàäàåò íèæíþþ ãðàíèöó ñòðàíèöû â ïèêñåëàõ. Ïðèìåð:

m Àòðèáóò LEFTMARGIN çàäàåò ëåâóþ ãðàíèöó ñòðàíèöû â ïèêñåëàõ. Ïðèìåð:

m Àòðèáóò RIGHTMARGIN çàäàåò ïðàâóþ ãðàíèöó ñòðàíèöû â ïèêñåëàõ. Ïðèìåð:

Ïðèìåðû èñïîëüçîâàíèÿ â HTML-äîêóìåíòå àòðèáóòîâ, ðåãóëèðóþùèõ ïîëîæåíèå ãðàíèö ñòðàíèöû, èìåþòñÿ â óðîêå 4. Íà ðèñ. 1.8 ïîêàçàíà âåá-ñòðàíèöà (ëèñòèíã 1.1), äëÿ êîòîðîé âåðõíÿÿ, ëåâàÿ, ïðàâàÿ è íèæíÿÿ ãðàíèöû íå çàäàíû, òî åñòü ðàâíû 0. Âèäíî, ÷òî òåêñò êàê áû ïðèëèïàåò ê ëåâîìó êðàþ ñòðàíèöû, îòñòóïîâ ñâåðõó è ñíèçó íå íàáëþäàåòñÿ. Ïðàâûé êðàé òåêñòà èìååò îòñòóï îò ïðàâîé ãðàíèöû òîëüêî èç-çà òîãî, ÷òî â íåì ïîñëå êàæäîé ñòðîêè óêàçàí òåã ïåðåõîäà íà íîâóþ ñòðîêó (òåã
). Ëèñòèíã 1.1. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, äëÿ êîòîðîé íå çàäàíû ãðàíèöû <TITLE>Ìîÿ ïåðâàÿ ïðîãðàììà

Àòðèáóòû òåãà

BOTTOMMARGIN=0 LEFTMARGIN=0 RIGHTMARGIN=0> À. Ñ. Ïóøêèí
Çèìíÿÿ äîðîãà
Ñêâîçü âîëíèñòûå òóìàíû
Ïðîáèðàåòñÿ ëóíà,
Íà ïå÷àëüíûå ïîëÿíû
Ëüåò ïå÷àëüíî ñâåò îíà

Ïî äîðîãå çèìíåé, ñêó÷íîé
Òðîéêà áîðçàÿ áåæèò,
Êîëîêîëü÷èê îäíîçâó÷íûé
Óòîìèòåëüíî ãðåìèò.

×òî-òî ñëûøèòñÿ ðîäíîå
Â äîëãèõ ïåñíÿõ ÿìùèêà:
Òî ðàçãóëüå óäàëîå
Òî ñåðäå÷íàÿ òîñêà...

Íè îãíÿ, íè ÷åðíîé õàòû,
Ãëóøü è ñíåã... Íàâñòðå÷ó ìíå,
Òîëüêî âåðñòû ïîëîñàòû
Ïîïàäàþòñÿ îäíå...

Ñêó÷íî, ãðóñòíî...Çàâòðà, Íèíà,
Çàâòðà ê ìèëîé âîçâðàòÿñü,
ß çàáóäóñü ó êàìèíà,
Çàãëÿæóñü íå íàãëÿäÿñü.

Çâó÷íî ñòðåëêà ÷àñîâàÿ
Ìåäíûé êðóã ñâîé ñîâåðøèò,
È, äîêó÷íûõ óäàëÿÿ,
Ïîëíî÷ü íàñ íå ðàçëó÷èò

Ãðóñòíî, Íèíà: ïóòü ìîé ñêó÷åí,
Äðåìëÿ ñìîëêíóë ìîé ÿìùèê,
Êîëîêîëü÷èê îäíîçâó÷íûé,
Îòóìàíåí ëóííûé ëèê.
1826

Ðèñ. 1.8. Âåá-ñòðàíèöà, äëÿ êîòîðîé íå çàäàíû ãðàíèöû

Íà ðèñ. 1.9 ïîêàçàíà âåá-ñòðàíèöà, äëÿ êîòîðîé âåðõíÿÿ, ëåâàÿ, ïðàâàÿ è íèæíÿÿ ãðàíèöû çàäàíû è ðàâíû 150 ïèêñåëîâ (ëèñòèíã 1.2). Âèäíî, ÷òî òåêñò èìååò îòñòóïû îò ëåâîãî è ïðàâîãî êðàåâ, à òàêæå ñâåðõó (è ñíèçó, â ÷åì ìîæíî óáåäèòüñÿ, âûïîëíèâ ïðîêðóòêó). Òàê êàê òåêñò ïîëíîñòüþ â îêíî íå ïîìåùàåòñÿ, àâòîìàòè÷åñêè ñïðàâà ïîÿâëÿåòñÿ âåðòèêàëüíàÿ ïîëîñà ïðîêðóòêè. Ëèñòèíã 1.2. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, äëÿ êîòîðîé çàäàíû ãðàíèöû <TITLE>Ìîÿ ïåðâàÿ ïðîãðàììà À. Ñ. Ïóøêèí
Çèìíåå óòðî
Ìîðîç è ñîëíöå; äåíü ÷óäåñíûé;
Åùå òû äðåìëåøü, äðóã ïðåëåñòíûé,
Ïîðà, êðàñàâèöà, ïðîñíèñü:
Îòêðîé ñîìêíóòû íåãîé âçîðû
Íàâñòðå÷ó ñåâåðíîé Àâðîðû,
Çâåçäîþ Ñåâåðà ÿâèñü!

Âå÷îð, òû ïîìíèøü, âüþãà çëèëàñü,
Íà ìóòíîì íåáå ìãëà íîñèëàñü;
Ëóíà, êàê áëåäíîå ïÿòíî,
Ñêâîçü òó÷è ìðà÷íûå æåëòåëà,
À òû ïå÷àëüíàÿ ñèäåëà-
À íûí÷å ïîãëÿäè â îêíî:

Ïîä ãîëóáûìè íåáåñàìè
Âåëèêîëåïíûìè êîâðàìè,
Áëåñòÿ íà ñîëíöå, ñíåã ëåæèò;
Ïðîçðà÷íûé ëåñ îäèí ÷åðíååò,
È åëü ñêâîçü èíåé çåëåíååò,
È ðå÷êà

Óðîê 1. Îñíîâíûå ñâåäåíèÿ

ïîäî ëüäîì áëåñòèò.

Âñÿ êîìíàòà ÿíòàðíûì áëåñêîì
Îçàðåíà. Âåñåëûì òðåñêîì
Òðåùèò çàòîïëåííàÿ ïå÷ü
Ïðèÿòíî äóìàòü ó ëåæàíêè.
Íî çíàåøü: íå âåëåòü ëè â ñàíêè
Êîáûëêó áóðóþ çàïðå÷ü?

Ñêîëüçÿ ïî óòðåííåìó ñíåãó,
Äðóã ìèëûé, ïðåäàäèìñÿ áåãó
Íåòåðïåëèâîãî êîíÿ
È íàâåñòèì ïîëÿ ïóñòûå,
Ëåñà, íåäàâíî ñòîëü ãóñòûå,
È áåðåã, ìèëûé äëÿ ìåíÿ
1829

Ðèñ. 1.9. Âåá-ñòðàíèöà ñ îòñòóïàìè îò ãðàíèö

Ïîäâåäåì èòîãè Â ýòîì óðîêå ðàññìîòðåíû áàçîâûå ïîíÿòèÿ, îòíîñÿùèåñÿ ê ñîçäàíèþ âåáñòðàíèö. Ïîêàçàíû ñòðóêòóðà HTML-äîêóìåíòà è íåêîòîðûå îñíîâíûå òåãè. Ïåðå÷èñëåíû ïðàâèëà ñîçäàíèÿ âåá-ñòðàíèö. Â çàêëþ÷åíèå óðîêà ïðåäñòàâëåíî íåñêîëüêî ïðèìåðîâ âåá-ñòðàíèö.

Óðîê 2 Òåêñò Â ýòîì óðîêå ðàññìàòðèâàþòñÿ îñíîâíûå òåãè, ïðåäíàçíà÷åííûå äëÿ ðàáîòû ñ òåêñòîì. Ýòè òåãè ïîçâîëÿþò ôîðìàòèðîâàòü òåêñò, êðàñèâî ðàñïîëàãàòü åãî íà ñòðàíèöå, à òàêæå âûâîäèòü â âèäå âñïëûâàþùèõ ïîäñêàçîê.

Óðîê 2. Òåêñò

Ïåðâàÿ âåá-ñòðàíèöà Ìîæíî îòêðûòü Áëîêíîò è â òåëå äîêóìåíòà çàïèñàòü òåêñò, íå çàäóìûâàÿñü î åãî ðàçìåðàõ è öâåòå. Íà ðèñ. 2.1 ïîêàçàíà òàêàÿ ïðîãðàììà ïðè ïðîñìîòðå â áðàóçåðå (ëèñòèíã 2.1).

Ðèñ. 2.1. Âåá-ñòðàíèöà ñ òåêñòîì

Ëèñòèíã 2.1. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû ñ òåêñòîì <TITLE> Ìîÿ ïåðâàÿ Âåá-ñòðàíè÷êà 33 óäèâèòåëüíåéøèå áóêâû ðóññêîãî àëôàâèòà ïåðåäàþò ÷åëîâå÷åñòâó ñîáûòèÿ, ôàêòû, íàñòðîåíèå, ïåðåæèâàíèÿ, ðàäîñòü è âäîõíîâåíèå, òî åñòü âñå, ÷òî ìîæíî âèäåòü, ñëûøàòü, ïðîáîâàòü, òðîãàòü, ÷åì ìîæíî íàñëàæäàòüñÿ. Êàê æå áóêâû ìîãóò ïåðåäàòü îãðîìíîå êîëè÷åñòâî èíôîðìàöèè? Áóêâû îáðàçóþò ñëîâî, ñëîâà ñîáèðàþòñÿ â ïðåäëîæåíèÿ, ïðåäëîæåíèÿ ìîãóò ñîñòàâèòü öåëóþ êíèãó. Êíèãè ñîñòîÿò èç òåêñòà è ðèñóíêîâ.

Êàê âèäíî íà ðèñóíêå, òî, ÷òî íàõîäèòñÿ ìåæäó òåãàìè <TITLE> è , íå ïîÿâëÿåòñÿ íà ýêðàíå. Îäíàêî ïðè çàãðóçêå äîêóìåíòà â áðàóçåð ýòîò òåêñò çàãðóæàåòñÿ â ïåðâóþ î÷åðåäü è îòîáðàæàåòñÿ â çàãîëîâêå îêíà áðàóçåðà. Åñëè òåêñò çàãîëîâêà äîñòàòî÷íî èíôîðìàòèâåí, ïîëüçîâàòåëü â ïðîöåññå ïîèñêà íóæíûõ äîêóìåíòîâ óæå íà ýòàïå çàãðóçêè ìîæåò îïðåäåëèòü, äåéñòâèòåëüíî ëè åìó íóæåí ýòîò äîêóìåíò, à åñëè íå íóæåí, òî ñðàçó îòêàçàòüñÿ îò åãî çàãðóçêè è ïåðåéòè ê çàãðóçêå ñëåäóþùåãî. Òåêñò íàçâàíèÿ òðåáóåòñÿ è ïðè ñîçäàíèè çàêëàäêè íà äàííûé äîêóìåíò, ñ ýòîé òî÷êè çðåíèÿ åãî èíôîðìàòèâíîñòü òàêæå î÷åíü âàæíà.

Óðîâíè çàãîëîâêîâ Çàãîëîâêè ðàçëè÷íûõ óðîâíåé ïîçâîëÿþò ñòðóêòóðíî ðàçäåëèòü ôîðìàëüíî íå îãðàíè÷åííûé ïî äëèíå òåêñò íà îòäåëüíûå ðàçäåëû è àáçàöû. Ïåðâûé óðîâåíü çàãîëîâêîâ (ñàìûé âûñîêèé) îáîçíà÷àåòñÿ öèôðîé 1, ñëåäóþùèé — 2, è ò. ä. Òåãè

Óðîâíè çàãîëîâêîâ

ñ ìåíüøèìè íîìåðàìè îïðåäåëÿþò çàãîëîâêè áîëåå âûñîêèõ óðîâíåé. Áîëüøèíñòâî áðàóçåðîâ ïîääåðæèâàåò èíòåðïðåòàöèþ øåñòè óðîâíåé çàãîëîâêîâ, îïðåäåëÿÿ êàæäîìó èç íèõ ñîáñòâåííûé ñòèëü. Çàãîëîâîê ñàìîãî âåðõíåãî óðîâíÿ èìååò ïðèçíàê 1. Ñèíòàêñèñ çàãîëîâêà ïåðâîãî óðîâíÿ (H, îò àíãë. head — çàãîëîâîê): Çàãîëîâîê ïåðâîãî óðîâíÿ

Çàãîëîâîê ëþáîãî óðîâíÿ ìîæåò áûòü ïðåäñòàâëåí â îáùåì ñëó÷àå òàê: Çàãîëîâîê x-ãî óðîâíÿ

Çäåñü x — öèôðà îò 1 äî 6, îïðåäåëÿþùàÿ óðîâåíü çàãîëîâêà. Àòðèáóò ALIGN óïðàâëÿåò ãîðèçîíòàëüíûì âûðàâíèâàíèåì, ïðèíèìàÿ çíà÷åíèå LEFT (âëåâî), CENTER (ïî öåíòðó), RIGHT (âïðàâî) èëè JUSTIFY (ïî øèðèíå îò ëåâîé ãðàíèöû äî ïðàâîé). Íà ðèñ. 2.2 ïîêàçàíî îêíî ïðîãðàììû, ñîäåðæàùåé çàãîëîâêè, ïðè ïðîñìîòðå â áðàóçåðå (ëèñòèíã 2.2).

Ðèñ. 2.2. Âåá-ñòðàíèöà ñ çàãîëîâêàìè ðàçíûõ óðîâíåé

Ëèñòèíã 2.2. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû ñ çàãîëîâêàìè <TITLE> Çàãîëîâêè Çàãîëîâîê 1 - Òðàíñïîðòíûé ïðîòîêîë
Çàãîëîâîê 2 - Ïðîòîêîë ìàðøðóòèçàöèè
Çàãîëîâîê 3 - Ïðîòîêîë ïåðåäà÷è ôàéëîâ
Çàãîëîâîê 4 - Ïðîòîêîë ïåðåäà÷è ïî÷òû
Çàãîëîâîê 5 - Ñåòåâîé ïðîòîêîë
Çàãîëîâîê 6 - Ïðîòîêîë ïîääåðæêè ñåòåâîãî àäðåñà

Óðîê 2. Òåêñò

Äàííûé òåã ïîÿâèëñÿ â HTML âåðñèè 2.0. Çàãîëîâêè áîëåå âûñîêèõ óðîâíåé îòîáðàæàþòñÿ øðèôòîì áîëüøåãî ðàçìåðà.

Øðèôò Òåã ïîçâîëÿåò ñ ïîìîùüþ àòðèáóòîâ óïðàâëÿòü ðàçìåðîì è öâåòîì øðèôòà. Àòðèáóò SIZE óïðàâëÿåò ðàçìåðîì øðèôòà. Øðèôò ìîæåò èìåòü ðàçìåð îò 1 äî 7. Ìîæíî óêàçàòü ðàçìåð øðèôòà íåïîñðåäñòâåííî öèôðîé èëè çàäàòü ñìåùåíèå îòíîñèòåëüíî áàçîâîãî çíà÷åíèÿ (ïî óìîë÷àíèþ — 3) â ïîëîæèòåëüíóþ èëè îòðèöàòåëüíóþ ñòîðîíó. Ñîîòâåòñòâèå ðàçìåðà øðèôòà âåëè÷èíå â ïóíêòàõ èëëþñòðèðóåò òàáë. 2.1. Òàáëèöà 2.1. Òèïè÷íûå ðàçìåðû øðèôòîâ è èõ âåëè÷èíû â ïóíêòàõ Ðàçìåð øðèôòà 1

Òèïè÷íàÿ âåëè÷èíà â ïóíêòàõ 8

Ðàçìåð øðèôòà ìîæíî èçìåíèòü ïðè ïîìîùè ñëåäóþùåé êîìàíäû:

Äëÿ èçìåíåíèÿ áàçîâîãî çíà÷åíèÿ ñëóæèò òàêàÿ êîìàíäà:

Ïðèìåð èñïîëüçîâàíèÿ øðèôòîâ ðàçíîãî ðàçìåðà ïîêàçàí íà ðèñ. 2.3 (ëèñòèíã 2.3).

Ðèñ. 2.3. Âåá-ñòðàíèöà ñ áóêâàìè ðàçíîãî ðàçìåðà

Øðèôò

Ëèñòèíã 2.3. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé áóêâû ðàçíîãî ðàçìåðà <TITLE> Ðàçìåð øðèôòà Ï Å Ò Å Ð Á Ó Ð Ã

Äàííûé òåã ïîÿâèëñÿ â HTML âåðñèè 3.2, îäíàêî â íàñòîÿùåå âðåìÿ îí íå ðåêîìåíäîâàí ê ïðèìåíåíèþ. Âìåñòî íåãî æåëàòåëüíî èñïîëüçîâàòü ñðåäñòâà êàñêàäíûõ ëèñòîâ ñòèëåé (ñì. óðîê 17). ×òîáû èçìåíèòü öâåò øðèôòà, èñïîëüçóåòñÿ àòðèáóò COLOR òåãà :

Öâåò óêàçûâàåòñÿ â öâåòîâîé ìîäåëè RGB ñîîòâåòñòâóþùèìè çíà÷åíèÿìè öâåòîâûõ ñîñòàâëÿþùèõ â øåñòíàäöàòåðè÷íîì ôîðìàòå. Íàïðèìåð, áåëûé öâåò îáîçíà÷àåòñÿ FFFFFF, ÷åðíûé — 000000, ñèíèé — 0000FF è ò. ï. Ïðèìåð âåá-ñòðàíèöû, ñîäåðæàùåé òåêñò ðàçíîãî öâåòà, ïîêàçàí íà ðèñ. 2.4 (ëèñòèíã 2.4).

Ðèñ. 2.4. Âåá-ñòðàíèöà ñ ðàçíîöâåòíûì òåêñòîì

Ëèñòèíã 2.4. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû ñ ðàçíîöâåòíûì òåêñòîì <TITLE> Öâåò øðèôòà Êðàñíûé

Óðîê 2. Òåêñò

Çåëåíûé Ñèíèé

Òåã îïðåäåëÿåò áàçîâûé (îñíîâíîé äëÿ âñåé ñòðàíèöû) ðàçìåð øðèôòà, èìååò îòêðûâàþùèé äåñêðèïòîð. SIZE — àòðèáóò òåãà, êîòîðûé îïðåäåëÿåò áàçîâûé ðàçìåð ýòîãî øðèôòà. SIZE ìåíÿåòñÿ â ïðåäåëàõ îò 1 äî 7. Ïî óìîë÷àíèþ èñïîëüçóåòñÿ âåëè÷èíà 3. Ïðèìåð ïðèìåíåíèÿ ýòîãî òåãà ìîæíî ïîñìîòðåòü íà ðèñ. 2.5, à êîä ïðîãðàììû — â ëèñòèíãå 2.5.

Ðèñ. 2.5. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåã

Ëèñòèíã 2.5. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåã <TITLE>Òåãè ôîðìàòèðîâàíèÿ ñèìâîëîâ Ëîãîòèï - ýëåìåíò ôèðìåííîãî ñòèëÿ,
îðèãèíàëüíîå íà÷åðòàíèå íàèìåíîâàíèÿ ðåêëàìîäàòåëÿ,
îäíà èç ôîðì òîðãîâîãî çíàêà

Òåã ïîÿâèëñÿ â HTML âåðñèè 3.2. Âìåñòî äàííîãî òåãà ðåêîìåíäóåòñÿ èñïîëüçîâàòü ñðåäñòâà êàñêàäíûõ ëèñòîâ ñòèëåé (ñì. óðîê 17), à øðèôò ìîæåò áûòü èçìåíåí ñ ïîìîùüþ òåãà .

Àáçàöû è ðàçðûâû ñòðîê Â HTML-äîêóìåíòå íåâîçìîæíî ðàçáèòü òåêñò íà àáçàöû, èñïîëüçóÿ êëàâèøó Enter. Íàæàòèå ýòîé êëàâèøè óëó÷øàåò âíåøíèé âèä èñõîäíîãî òåêñòà, íî íå âëèÿåò íà ïîëó÷àåìîå èçîáðàæåíèå. Äëÿ ïåðåõîäà íà ñëåäóþùóþ ñòðîêó ñëåäóåò âîñïîëüçîâàòüñÿ òåãîì
, à äëÿ ñîçäàíèÿ ïóñòîé ñòðîêè — òåãîì . Òåã
ïîçâîëÿåò ðàçäåëèòü òåêñò íà àáçàöû. Åñëè ýòîãî íå ñäåëàòü, äîêóìåíò áóäåò âûãëÿäåòü êàê îäèí áîëüøîé àáçàö. ALIGN — àòðèáóò âûðàâíèâàíèÿ òåãà
. Ýòîò àòðèáóò ìîæåò èìåòü çíà÷åíèå LEFT, CENTER, RIGHT, JUSTIFY, ÷òî ïîçâîëÿåò âûðîâíÿòü àáçàö ïî ëåâîìó êðàþ, ïî

Àáçàöû è ðàçðûâû ñòðîê

öåíòðó, ïî ïðàâîìó êðàþ èëè ïî øèðèíå ñîîòâåòñòâåííî. Íàïðèìåð, ñëåäóþùàÿ çàïèñü âûðàâíèâàåò àáçàö ïî ëåâîìó êðàþ:

Äàííûé òåã ïîÿâèëñÿ â HTML âåðñèè 2.0, îí íå ìîæåò ñîäåðæàòü äðóãèå îòêðûâàþùèå è çàêðûâàþùèå òåãè, òî åñòü ìåæäó òåãàìè
è
ìîæåò áûòü òîëüêî òåêñò è ðàçðûâ ñòðîêè, íî íå äðóãèå òåãè. Òåã
èçâåùàåò áðàóçåð î ðàçðûâå ñòðîêè. Äîïîëíèòåëüíûé ïàðàìåòð CLEAR ïîçâîëÿåò ðàñøèðèòü âîçìîæíîñòè òåãà
, íå ïðîñòî îáåñïå÷èâàÿ ïåðåâîä ñòðîêè, à ðàçìåùàÿ ñëåäóþùóþ ñòðîêó, íà÷èíàÿ ñ ëåâîé (LEFT), ïðàâîé (RIGHT), îáåèõ (ALL) ãðàíèö îêíà áðàóçåðà, èëè îáû÷íûì ñïîñîáîì (NONE). Íàïðèìåð, åñëè ðÿäîì ñ òåêñòîì ñëåâà äîëæåí ðàñïîëàãàòüñÿ ðèñóíîê, òî ìîæíî èñïîëüçîâàòü òåã
äëÿ ñìåùåíèÿ òåêñòà ïîä ðèñóíîê. Äàííûé òåã ïîÿâèëñÿ â HTML âåðñèè 2.0. Â íàñòîÿùåå âðåìÿ àòðèáóò CLEAR íå ðåêîìåíäîâàí ê ïðèìåíåíèþ, âìåñòî íåãî æåëàòåëüíî èñïîëüçîâàòü ñðåäñòâà êàñêàäíûõ ëèñòîâ ñòèëåé (ñì. óðîê 17). Òåã (îò àíãë. division — ðàçäåë) ïîçâîëÿåò âûäåëèòü â ñòðóêòóðå äîêóìåíòà íåñêîëüêî ðàçäåëîâ. Îí ÿâëÿåòñÿ áëî÷íûì ýëåìåíòîì, ôóíêöèîíèðóþùèì âî ìíîãîì ïîäîáíî ýëåìåíòó . Åñëè çàêðûâàþùèé òåã
îïóùåí, òî ýôôåêòèâíî çàìåíÿåò åãî, íà÷èíàÿ íîâûé àáçàö. Îí ìîæåò èìåòü àòðèáóò ALIGN, êîòîðûé èìååò çíà÷åíèå LEFT, CENTER èëè RIGHT è óêàçûâàåò îòñòóï. Êàæäûé ñëåäóþùèé ðàçäåë èãíîðèðóåò çíà÷åíèå ALIGN, çàäàííîå äëÿ ïðåäûäóùåãî ðàçäåëà. Ñèíòàêñèñ: Òåêñò ðàçäåëà

Ïðèìåð èñïîëüçîâàíèÿ ýòîãî òåãà ìîæíî ïîñìîòðåòü íà ðèñ. 2.6, à êîä ïðîãðàììû — â ëèñòèíãå 2.6.

Ðèñ. 2.6. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåã

Ëèñòèíã 2.6. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåã <TITLE> Òåãè ôîðìàòèðîâàíèÿ ñèìâîëîâ Àòòèòþä - ñîöèàëüíî-ïñèõîëîãè÷åñêàÿ óñòàíîâêà, âíóòðåííÿÿ ïîòðåáíîñòü ÷åëîâåêà ê êàêèì-ëèáî äåéñòâèÿì (íàïðèìåð, ê ïîêóïêå ðåêëàìèðóåìîãî òîâàðà)

Óðîê 2. Òåêñò

Àôèøà - ñòàðåéøåå ñðåäñòâî íàðóæíîé ðåêëàìû, âûïîëíåííîå íà ïëîòíîé áóìàãå èëè êàðòîíå
Áóëë-Ìàðê - ðåêëàìà èçäàòåëüñòâà, âêëàäûâàåìàÿ â êíèãó, æóðíàë, êàòàëîã, â âèäå êðàñî÷íîé çàêëàäêè
Ìàðêà - èìÿ, òåðìèí, çíàê, ñèìâîë, ðèñóíîê èëè èõ ñî÷åòàíèå, èäåíòèôèöèðóþùåå òîâàðû èëè óñëóãè îäíîãî èëè íåñêîëüêèõ ïðîèçâîäèòåëåé (ïðîäàâöîâ) è îòëè÷àþùèå èõ îò òîâàðîâ è óñëóã êîíêóðåíòîâ

Òàê êàê äàííûé òåã ïîÿâèëñÿ â HTML âåðñèè 3.2 è èñïîëüçóåòñÿ â ñî÷åòàíèè ñ êàñêàäíûìè ëèñòàìè ñòèëåé, îí ïðåäñòàâëÿåò ñîáîé ìîùíîå ñðåäñòâî çàäàíèÿ ñòðóêòóðû äîêóìåíòà.

Âûðàâíèâàíèå Êàê óæå óïîìèíàëîñü, àòðèáóò ALIGN ïîçâîëÿåò âûðîâíÿòü òåêñò ïî ëåâîìó èëè ïðàâîìó êðàþ, ïî öåíòðó èëè ïî øèðèíå ñòðàíèöû. Ïî óìîë÷àíèþ òåêñò, ãðàôèêà è ýëåìåíòû òàáëèöû âûðàâíèâàþòñÿ ïî ëåâîìó êðàþ è íå âûðàâíèâàþòñÿ ïî ïðàâîìó êðàþ, òî åñòü íà÷àëî ñòðîê íàõîäèòñÿ íà îäíîì óðîâíå, à êîíåö — íà ðàçíûõ. Âûðàâíèâàíèå ïî ëåâîìó êðàþ çàäàåòñÿ àòðèáóòîì ALIGN=LEFT, âûðàâíèâàíèå ïî ïðàâîìó êðàþ — àòðèáóòîì ALIGN=RIGHT. Öåíòðèðîâàíèå ýëåìåíòîâ äîêóìåíòà ìîæíî ïðîèçâîäèòü ðàçíûìè ñïîñîáàìè, íàïðèìåð ñ ïîìîùüþ òåãà

Âû ìîæåòå òàêæå öåíòðèðîâàòü âñå ýëåìåíòû äîêóìåíòà â îêíå áðàóçåðà. Äëÿ ýòîãî ìîæíî èñïîëüçîâàòü òåã . Âñå ýëåìåíòû ìåæäó òåãàìè è áóäóò íàõîäèòüñÿ â öåíòðå îêíà. Öåíòðèðîâàíèå ìîæíî ïðîèçâîäèòü è â àáçàöå:

Ïðèìåð âåá-ñòðàíèöû, ñîäåðæàùåé òåêñò, âûðîâíåííûé ðàçëè÷íûìè ñïîñîáàìè, ïîêàçàí íà ðèñ. 2.7 (ëèñòèíã 2.7).

Ðèñ. 2.7. Âåá-ñòðàíèöà ñ òåêñòîì, âûðîâíåííûì ðàçëè÷íûìè ñïîñîáàìè

Ïðåäâàðèòåëüíîå ôîðìàòèðîâàíèå

Ëèñòèíã 2.7. Ïðèìåð âûðàâíèâàíèÿ òåêñòà ðàçëè÷íûìè ñïîñîáàìè <TITLE> Öåíòðèðîâàíèå è âûðàâíèâàíèå
Àòðèáóò ALIGN ïîçâîëÿåò âûðîâíÿòü òåêñò ïî ëåâîìó èëè ïðàâîìó êðàþ,
ïî öåíòðó èëè ïî øèðèíå
Ïî óìîë÷àíèþ òåêñò, ãðàôèêà è ýëåìåíòû òàáëèöû âûðàâíèâàþòñÿ ïî ëåâîìó êðàþ
è íå âûðàâíèâàþòñÿ ïî ïðàâîìó êðàþ, òî åñòü íà÷àëî ñòðîê íàõîäèòñÿ íà îäíîì óðîâíå, à êîíåö - íà ðàçíûõ.
Âûðàâíèâàíèå ïî ëåâîìó êðàþ çàäàåòñÿ àòðèáóòîì ALIGN=LEFT. Âûðàâíèâàíèå ïî ïðàâîìó êðàþ çàäàåòñÿ
àòðèáóòîì ALIGN=RIGHT
Öåíòðèðîâàíèå ýëåìåíòîâ äîêóìåíòà ìîæíî ïðîèçâîäèòü ðàçíûìè ñïîñîáàìè,
íàïðèìåð ñ ïîìîùüþ òåãà ALIGN=CENTER

Ïðåäâàðèòåëüíîå ôîðìàòèðîâàíèå Òåã ïîçâîëÿåò ïðåäñòàâëÿòü íà ýêðàíå òåêñò ñî ñïåöèôè÷åñêèì ôîðìàòèðîâàíèåì. Ïðåäâàðèòåëüíî îòôîðìàòèðîâàííûé òåêñò çàêàí÷èâàåòñÿ çàâåðøàþùèì òåãîì
. Âíóòðè ïðåäâàðèòåëüíî îòôîðìàòèðîâàííîãî òåêñòà ðàçðåøàåòñÿ èñïîëüçîâàòü: m ñèìâîëû ïåðåâîäà ñòðîêè; m ñèìâîëû òàáóëÿöèè (ñäâèã íà 8 ñèìâîëîâ âïðàâî); m íåïðîïîðöèîíàëüíûé øðèôò, óñòàíàâëèâàåìûé áðàóçåðîì. Ôîðìàòèðîâàíèå àáçàöà, çàäàííîå äðóãèìè òåãàìè, òàêèìè êàê è , áóäåò èãíîðèðîâàòüñÿ áðàóçåðîì ïðè ïîìåùåíèè èõ ìåæäó òåãàìè è
.

Ðèñ. 2.8. Âåá-ñòðàíèöà ñ òåêñòîì, èìåþùèì ñïåöèôè÷åñêîå ôîðìàòèðîâàíèå

Óðîê 2. Òåêñò

Ïðèìåð âåá-ñòðàíèöû, ñîäåðæàùåé òåêñò ñî ñïåöèôè÷åñêèì ôîðìàòèðîâàíèåì, ïîêàçàí íà ðèñ. 2.8 (ëèñòèíã 2.8). Ëèñòèíã 2.8. Ïðèìåð ñïåöèôè÷åñêîãî ôîðìàòèðîâàíèÿ òåêñòà <TITLE> Ñïåöèôè÷åñêîå ôîðìàòèðîâàíèå Òåã ïðåäâàðèòåëüíîãî ôîðìàòèðîâàíèÿ ïîçâîëÿåò ïðåäñòàâëÿòü òåêñò ñî ñïåöèôè÷åñêèì
ôîðìàòèðîâàíèåì íà ýêðàíå. Ïðåäâàðèòåëüíî îòôîðìàòèðîâàííûé òåêñò çàêàí÷èâàåòñÿ
çàâåðøàþùèì òåãîì
. Âíóòðè ïðåäâàðèòåëüíî îòôîðìàòèðîâàííîãî òåêñòà ðàçðåøàåòñÿ
èñïîëüçîâàòü: ñèìâîëû ïåðåâîäà ñòðîêè ñèìâîëû òàáóëÿöèè (ñäâèã íà 8 ñèìâîëîâ âïðàâî) íåïðîïîðöèîíàëüíûé øðèôò, óñòàíàâëèâàåìûé áðàóçåðîì

Äàííûé òåã ïîÿâèëñÿ â HTML âåðñèè 2.0. Â çàðàíåå îòôîðìàòèðîâàííûé òåêñò íåæåëàòåëüíî âêëþ÷àòü ñèìâîëû òàáóëÿöèè, ïîñêîëüêó ïðè ýòîì ìîæåò íàðóøèòüñÿ âûðàâíèâàíèå. Ïðèìåð, êîòîðûé ìîæíî ïîñìîòðåòü íà ðèñ. 2.9, à êîä ïðîãðàììû — â ëèñòèíãå 2.9, ñîäåðæèò òåêñò ðàçíîé âûñîòû è òåã .

Ðèñ. 2.9. Âåá-ñòðàíèöà ñ òåêñòîì ðàçíîé âûñîòû

Ëèñòèíã 2.9. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåêñò ðàçíîé âûñîòû <TITLE>Ðàçìåð øðèôòà Ðàçìåð øðèôòà èçìåíÿåòñÿ â ïóíêòàõ
1ïóíêò ðàâåí 1/72 äþéìà 1ïóíêò ðàâåí 0,353 ìì òåêñò n - ÷èñëî ïóíêòîâ,íà êîòîðîå íåîáõîäèìî óâåëè÷èòü èëè óìåíüøèòü ðàçìåð øðèôòà

Çàäàíèå íà÷åðòàíèÿ

Òåãè - òåãè îòôîðìàòèðîâàííîãî òåêñòà

Çàäàíèå íà÷åðòàíèÿ Äëÿ âûäåëåíèÿ òåêñòîâîé èíôîðìàöèè â äîêóìåíòàõ ìîæíî èñïîëüçîâàòü ðàçëè÷íîå íà÷åðòàíèå. Áîëüøèíñòâîì áðàóçåðîâ ïîääåðæèâàåòñÿ æèðíîå è êóðñèâíîå íà÷åðòàíèå, ìîíîøèðèííûé øðèôò, áîëüøîé è ìàëåíüêèé øðèôòû, à òàêæå ïîäñòðî÷íûé è íàäñòðî÷íûé èíäåêñû. Ýòè è ïîäîáíûå èì âàðèàíòû íà÷åðòàíèÿ çàäàþòñÿ ñëåäóþùèìè òåãàìè: Ýòîò òåêñò æèðíûé Ýòîò òåêñò íàêëîííûé Ýòîò òåêñò ïîä÷åðêíóòûé Ýòîò òåêñò ñ ìîíîøèðèííûì øðèôòîì Ýòîò òåêñò áîëüøîé Ýòîò òåêñò ìàëåíüêèé Ýòîò òåêñò óâåëè÷åííûé Ýòîò òåêñò <STRIKE> ïåðå÷åðêíóòûé Ýòîò òåêñò ïîäñòðî÷íûé Ýòîò òåêñò íàäñòðî÷íûé

Ðåçóëüòàò ïðèìåíåíèÿ ýòèõ òåãîâ ïîêàçàí íà ðèñ. 2.10 (ëèñòèíã 2.10).

Ðèñ. 2.10. Âåá-ñòðàíèöà ñ òåêñòîì ðàçíîãî íà÷åðòàíèÿ

Òåãè , , , ïîÿâèëèñü â HTML âåðñèè 2.0, òåãè , , , <STRIKE>, , — â HTML âåðñèè 3.2. Õîòÿ ïîëüçîâàòüñÿ ýòèìè òåãàìè íå çàïðåùåíî, êîíñîðöèóì W3C (World Wide Web Consortium) ðåêîìåíäóåò ïðèìåíÿòü âìåñòî íèõ ñðåäñòâà êàñêàäíûõ ëèñòîâ ñòèëåé (ñì. óðîê 17). Òåã èñïîëüçóåòñÿ ñ öåëüþ äîïîëíèòåëüíîãî âûäåëåíèÿ ïåðåìåííûõ â êîäå. Ñèíòàêñèñ: ïåðåìåííàÿ

Óðîê 2. Òåêñò

Ëèñòèíã 2.10. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåêñò ðàçíîãî íà÷åðòàíèÿ <TITLE> Ñòèëè øðèôòà Ýòîò òåêñò æèðíûé
Ýòîò òåêñò íàêëîííûé
Ýòîò òåêñò ïîä÷åðêíóòûé
Ýòîò òåêñò ñ íåïðîïîðöèîíàëüíûì øðèôòîì
Ýòîò òåêñò áîëüøîé
Ýòîò òåêñò ìàëåíüêèé
Ýòîò òåêñò óâåëè÷åííûé
Ýòîò òåêñò <STRIKE> ïåðå÷åðêíóòûé
Ýòîò òåêñò ïîäñòðî÷íûé
Ýòîò òåêñò íàäñòðî÷íûé

Ïðèìåð èñïîëüçîâàíèÿ ýòîãî òåãà ìîæíî ïîñìîòðåòü íà ðèñ. 2.11, à êîä ïðîãðàììû — â ëèñòèíãå 2.11.

Ðèñ. 2.11. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåã

Ëèñòèíã 2.11. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåã <TITLE>Òåãè ôîðìàòèðîâàíèÿ Äîäæåð - ðåêëàìíûé ïðîñïåêò

Òåã ïîÿâèëñÿ â HTML âåðñèè 2.0. Îí îïðåäåëÿåò ïåðåìåííóþ èëè ïàðàìåòð ïðîãðàììû è îáû÷íî îòîáðàæàåòñÿ êóðñèâîì. Òåã ïîçâîëÿåò âûäåëèòü ôðàãìåíò òåêñòà äëÿ åãî ïîñëåäóþùåãî ôîðìàòèðîâàíèÿ, îäíàêî â îòëè÷èå îò òåãà íå íà÷èíàåò íîâûé àáçàö. Òåã ñîçäàåò ñòðóêòóðó òåêñòîâîãî óðîâíÿ, îïðåäåëÿåìóþ ïîëüçîâàòåëåì. Ïðèìåð èñïîëüçîâàíèÿ ýòîãî òåãà ìîæíî ïîñìîòðåòü íà ðèñ. 2.12, à êîä ïðîãðàììû — â ëèñòèíãå 2.12. Äàííûé òåã ïîÿâèëñÿ â HTML 4.0. Òàê êàê îí èñïîëüçóåòñÿ â ñî÷åòàíèè ñ êàñêàäíûìè ëèñòàìè ñòèëåé (ñì. óðîê 17), â äàííîì ïðèìåðå åãî ïðåèìóùåñòâà íå ñëèøêîì çàìåòíû.

Çàäàíèå íà÷åðòàíèÿ

Ëèñòèíã 2.12. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåã <TITLE>Òåãè ôîðìàòèðîâàíèÿ ñèìâîëîâ Ìåäèàïëàíèðîâàíèå - ñîñòàâëåíèå îïòèìàëüíîãî ïëàíà ðàçìåùåíèÿ ðåêëàìû â ÑÌÈ íà îñíîâå ìàðêåòèíãîâûõ è ìåäèàèññëåäîâàíèé. Ïàáëèñèòè - íåîïëà÷åííàÿ èíôîðìàöèÿ, ñòèìóëèðóþùàÿ ñïðîñ íà òîâàð èëè äåëîâóþ êàìïàíèþ ïîñðåäñòâîì ðàñïðîñòðàíåíèÿ î íèõ êîììåð÷åñêèõ è (èëè) ñîöèàëüíûõ ñâåäåíèé â ñðåäñòâàõ êîììóíèêàöèè Õàðàêòåðíûå ïðèçíàêè: äîñòîâåðíîñòü (â ñðàâíåíèè ñ ðåêëàìíûìè ñîîáùåíèÿìè); øèðîêèé îõâàò àóäèòîðèè (íîâèíêà, ñåíñàöèÿ, íàïîìèíàíèå); áðîñêîñòü (ýôôåêòèâíàÿ è ìíîãîæàíðîâàÿ ôîðìà).

Ðèñ. 2.12. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåã

Òåã <S> âûâîäèò òåêñò çà÷åðêíóòûì. Âñå, íàõîäÿùååñÿ ìåæäó òåãàìè <S> è , áóäåò íàïèñàíî ïåðå÷åðêíóòûì øðèôòîì. Ýòî âñòðîåííûé ïàðíûé òåã. Îáÿçàòåëüíûõ àòðèáóòîâ íå èìååò. Ïðèìåð èñïîëüçîâàíèÿ òåãà ìîæíî ïîñìîòðåòü íà ðèñ. 2.13, à êîä ïðîãðàììû — â ëèñòèíãå 2.13.

Ðèñ. 2.13. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåã <S>

Ëèñòèíã 2.13. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåã <S> <TITLE>Ïåðå÷åðêíóòûé òåêñò <S> Õîò-øîï-òâîð÷åñêîå ðåêëàìíîå àòåëüå, âûïîëíÿþùåå îòäåëüíûå ôóíêöèè äèçàéíà ïî ñîçäàíèþ ýëåìåíòîâ ôèðìåííîãî ñòèëÿ, ðàçðàáîòêå îðèãèíàë-ìàêåòîâ ïå÷àòíîé ðåêëàìû.

Óðîê 2. Òåêñò

Òåã <S> ïîÿâèëñÿ â HTML âåðñèè 4.0. Âìåñòî äàííîãî òåãà êîíñîðöèóì W3C ðåêîìåíäóåò èñïîëüçîâàòü ñðåäñòâà êàñêàäíûõ ëèñòîâ ñòèëåé (ñì. óðîê 17).

Íåðàçðûâíûå ñòðîêè Òåã (îò àíãë. «no break» — «áåç ðàçðûâà») äàåò êîìàíäó áðàóçåðó îòîáðàæàòü âåñü òåêñò â îäíîé ñòðîêå, íå ðàçðûâàÿ åå. Ýòèì òåãîì ðàçìå÷àåòñÿ òåêñò, êîòîðûé íåîáõîäèìî óìåñòèòü íà îäíîé ñòðîêå, ïðè÷åì ýòîò òåêñò íè ïðè êàêèõ îáñòîÿòåëüñòâàõ íå äîëæåí áûòü ðàçáèò íà íåñêîëüêî ñòðîê. Òàêèì îáðàçîì, òåã ïðîòèâîïîëîæåí ïî ôóíêöèÿì òåãó
. Åñëè ñòðîêó òåêñòà ðàçìåñòèòü ìåæäó òåãàìè è , òî áðàóçåð íå íà÷íåò íîâóþ ñòðîêó, äàæå åñëè îíà âûéäåò çà ãðàíèöû ýêðàíà; âìåñòî ýòîãî áðàóçåð ïîçâîëèò ãîðèçîíòàëüíî ïðîêðó÷èâàòü îêíî. Ïðèìåð òàêîé ñòðîêè ïîêàçàí íà ðèñ. 2.14 (ëèñòèíã 2.14).

Ðèñ. 2.14. Âåá-ñòðàíèöà ñ íåðàçðûâíîé ñòðîêîé

Ëèñòèíã 2.14. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåêñò â îäíîé ñòðîêå áåç ðàçðûâà <TITLE> Ñòðîêè áåç ðàçðûâà Äàííàÿ ñòðîêà ÿâëÿåòñÿ ñàìîé äëèííîé ñòðîêîé äîêóìåíòà, êîòîðàÿ íå äîïóñêàåò êàêîãî-ëèáî ðàçáèåíèÿ ãäå áû òî íè áûëî

Åñëè âñå æå íåîáõîäèìî ðàçáèòü ñòðîêó íà äâå, òî â íóæíîå ìåñòî âñòàâëÿåòñÿ òåã , õîòÿ â ïîñëåäíåå âðåìÿ îí íå ðåêîìåíäóåòñÿ ê èñïîëüçîâàíèþ. Òåã çàäàåò «ìÿãêèé ðàçðûâ ñòðîêè» âíóòðè òåãà . Ñ ïîìîùüþ òåãà â äàííîì ìåñòå òåêñòà ïðè íåîáõîäèìîñòè áðàóçåð âûïîëíÿåò ïåðåõîä íà íîâóþ ñòðîêó. Ïðèìåð èñïîëüçîâàíèÿ ýòîãî òåãà ìîæíî ïîñìîòðåòü íà ðèñ. 2.15, à êîä ïðîãðàììû — â ëèñòèíãå 2.15.

Âñòàâêà öèòàò

Ëèñòèíã 2.15. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåãè è <TITLE>Òåãè ôîðìàòèðîâàíèÿ ñèìâîëîâ Êëþ÷åâûå ïîíÿòèÿ - Êëàññèôèöèðîâàííàÿ ðåêëàìà Ïðîôåññèîíàëüíûé ðèñê Ïåðñîíàëèçàöèÿ ðåêëàìû Ôàêòîð èíòåãðàöèè Áåñïðèáûëüíûå ñâÿçè

Ðèñ. 2.15. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåãè è

Âñòàâêà öèòàò Òåã îïðåäåëÿåò òåêñò êàê öèòàòó áîëüøîãî ðàçìåðà è îòîáðàæàåò åãî ñ îòñòóïàìè îò ëåâîãî è ïðàâîãî êðàåâ. Ýòîò òåã ïîçâîëÿåò ðàñïîëîæèòü òåêñò êîìïàêòíî â öåíòðå ñòðàíèöû. Ïðè èñïîëüçîâàíèè ýòîãî òåãà íåñêîëüêî ðàç òåêñò âñå áîëüøå ñæèìàåòñÿ ê öåíòðó. Òåã èìååò àòðèáóò CITE="URI", ãäå URI çàäàåò öèòèðóåìûé äîêóìåíò èëè ñîîáùåíèå. URI (Uniform Resource Identifier) — ýòî óíèôèöèðîâàííûé èäåíòèôèêàòîð ðåñóðñà, â ñîñòàâ êîòîðîãî âõîäèò URL. Òåêñò, îáîçíà÷åííûé òåãîì , âûâîäèòñÿ ñ îòñòóïîì îò ëåâîãî êðàÿ äîêóìåíòà íà 8 ïðîáåëîâ. Ïðèìåð èñïîëüçîâàíèÿ òåãà ïîêàçàí íà ðèñ. 2.16 (ëèñòèíã 2.16).

Ðèñ. 2.16. Ôðàãìåíò âåá-ñòðàíèöû ñ äëèííîé öèòàòîé

Óðîê 2. Òåêñò

Ëèñòèíã 2.16. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé öèòàòó <TITLE> Öèòàòà Òåã BLOCKQUOTE äîáàâëÿåò ïîëÿ ñëåâà è ñïðàâà îò òåêñòà.
Ýòîò òåã ïîçâîëÿåò ðàñïîëîæèòü òåêñò êîìïàêòíî è â öåíòðå ñòðàíèöû.
Ïðè èñïîëüçîâàíèè ýòîãî òåãà íåñêîëüêî ðàç òåêñò âñå áîëüøå ñæèìàåòñÿ ê öåíòðó.
Äàííûé òåã ïðåäíàçíà÷åí äëÿ îáîçíà÷åíèÿ â äîêóìåíòå öèòàòû èç äðóãîãî èñòî÷íèêà.
Òåêñò, ïîìå÷åííûé òåãîì, îòñòóïàåò îò ëåâîãî êðàÿ äîêóìåíòà íà 8 ïðîáåëîâ

Äàííûé òåã ïîÿâèëñÿ â HTML âåðñèè 2.0. Îí îáåñïå÷èâàåò âñòàâêó áîëåå äëèííûõ öèòàò ïî ñðàâíåíèþ ñ òåãîì . Òåã îôîðìëÿåò òåêñò â âèäå êðàòêîé öèòàòû. Òåã èìååò àòðèáóò CITE="URI", ãäå URI çàäàåò öèòèðóåìûé äîêóìåíò èëè ñîîáùåíèå. Òåã ïðåäíàçíà÷åí äëÿ îòîáðàæåíèÿ áîëåå êîðîòêèõ öèòàò ïî ñðàâíåíèþ ñ òåãîì . Îáû÷íî â ñîñòàâ öèòàòû íå âõîäÿò ñèìâîëû ðàçðûâà ñòðîêè, è öèòàòà ñ÷èòàåòñÿ ýëåìåíòîì òåêñòîâîãî óðîâíÿ. Ñèìâîëû êàâû÷åê îòîáðàæàåò áðàóçåð. Ïðèìåð èñïîëüçîâàíèÿ òåãà ïîêàçàí íà ðèñ. 2.17 (ëèñòèíã 2.17).

Ðèñ. 2.17. Ôðàãìåíò âåá-ñòðàíèöû ñ êîðîòêîé öèòàòîé

Ëèñòèíã 2.17. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåã <TITLE>Öèòàòà "Ïîñòåð" - íàðóæíàÿ ðåêëàìà, ïëàêàò

Êîììåíòàðèè Êàê ëþáîé ÿçûê, HTML ïîçâîëÿåò âñòàâëÿòü â òåëî äîêóìåíòà êîììåíòàðèè, êîòîðûå ñîõðàíÿþòñÿ ïðè ïåðåäà÷å äîêóìåíòà ïî ñåòè, íî íå îòîáðàæàþòñÿ áðàóçåðîì. Ñèíòàêñèñ êîììåíòàðèÿ:

Àêðîíèìû

Êîììåíòàðèè ìîãóò âñòðå÷àòüñÿ â äîêóìåíòå ãäå óãîäíî è â ëþáîì êîëè÷åñòâå. Äàííûé òåã ïîÿâèëñÿ â HTML âåðñèè 2.0.

Àêðîíèìû Äâà òåãà, è , ïîçâîëÿþò âûäåëÿòü àêðîíèìû, èëè àááðåâèàòóðû (ñîêðàùåíèÿ ïîëíûõ íàçâàíèé), â ïðåäåëàõ òåêñòà. Ñîäåðæèìîå òåãîâ è âûâîäèòñÿ â âèäå âñïëûâàþùèõ ïîäñêàçîê, êîòîðûå äàþò ïîëüçîâàòåëþ âîçìîæíîñòü óâèäåòü ðàñøèôðîâêó àêðîíèìîâ. Ñîäåðæàíèå òåãà ïðåäñòàâëÿåò ñîáîé àááðåâèàòóðó, îïèñàíèå êîòîðîé çàäàåòñÿ ïîñðåäñòâîì àòðèáóòà TITLE. Õîòÿ äàííûé òåã ïîÿâèëñÿ â HTML âåðñèè 4.0, â íàñòîÿùåå âðåìÿ áðàóçåðû åãî íå ïîääåðæèâàþò. Ïðèìåð èñïîëüçîâàíèÿ òåãà ïîêàçàí íà ðèñ. 2.18 (ëèñòèíã 2.18).

Ðèñ. 2.18. Ôðàãìåíò âåá-ñòðàíèöû, ñîäåðæàùåé àêðîíèì

Ëèñòèíã 2.18. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé àêðîíèì <TITLE> Àêðîíèì ÑÇÈÏ ÑÏÃÓÒÄ

Íå ñëåäóåò çàáûâàòü, ÷òî çíàê ðàâåíñòâà (=) â ïðîãðàììå íå äîëæåí áûòü îêðóæåí ïðîáåëàìè.

Òåã ïîÿâèëñÿ â HTML âåðñèè 4.0.

Óðîê 2. Òåêñò

Îïðåäåëåíèÿ Åñëè íàçâàíèå ïîìåñòèòü ìåæäó òåãàìè , òî ýòî íàçâàíèå îòîáðàçèòñÿ êóðñèâîì. Òåðìèíû ìîæíî çàäàòü åùå è òåãîì . Ïðèìåð èñïîëüçîâàíèÿ ýòèõ òåãîâ ïîêàçàí íà ðèñ. 2.19 (ëèñòèíã 2.19).

Ðèñ. 2.19. Ôðàãìåíò âåá-ñòðàíèöû ñ îïðåäåëåíèÿìè

Ëèñòèíã 2.19. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé îïðåäåëåíèÿ <TITLE> Îïðåäåëåíèå “Ïåðåóëîê Äæàìáóëà, äîì 13" Ýòî àäðåñ Ñåâåðî-çàïàäíîãî èíñòèòóòà ïå÷àòè
Ñàíêò-Ïåòåðáóðãñêîãî ãîñóäàðñòâåííîãî óíèâåðñèòåòà òåõíîëîãèè è äèçàéíà
PR - äåíüãè èç âîçäóõà Â Ðîññèè PR ïîêà íåäîîöåíèâàåòñÿ.
Åãî ðåïóòàöèÿ íå ñëèøêîì âûñîêà, à ñàìî ñëîâî PR ïðåâðàòèëîñü â “ïèàð” è âûçûâàåò íåãàòèâíûå
àññîöèàöèè. Åæåãîäíûé îáîðîò íà ðûíêå çàêàçíûõ ïóáëèêàöèé îöåíèâàåòñÿ â 20$ ìëí.
Òåïåðü ýòè äåíüãè ñ íåçàêîííîãî ðûíêà çàêàçóõè ïåðåòåêàþò â ëåãàëüíûé ðåêëàìíûé ðûíîê
- ñòàëî áîëüøå ñòàòåé ïîä øàïêîé “íà ïðàâàõ ðåêëàìû”.

Òåã ïîÿâèëñÿ â HTML âåðñèè 2.0. Îí îïðåäåëÿåò öèòàòó èëè ññûëêó íà èñòî÷íèê, ñîäåðæèìîå äàííîãî òåãà îáû÷íî âîñïðîèçâîäèòñÿ êóðñèâîì.

Øðèôòîâîå âûäåëåíèå Òåã èñïîëüçóåòñÿ ñ öåëüþ âûäåëåíèÿ îñîáûì øðèôòîì (îáû÷íî êóðñèâîì) ñëîâà èëè òåêñòà. Ñèíòàêñèñ: Òåêñò

Ïðèìåð èñïîëüçîâàíèÿ ýòîãî òåãà ìîæíî ïîñìîòðåòü íà ðèñ. 2.20, à êîä ïðîãðàììû — â ëèñòèíãå 2.20.

Èñïîëüçîâàíèå ìîíîøèðèííûõ øðèôòîâ

Ëèñòèíã 2.20. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû ñî ñïåöèôè÷åñêèì ôîðìàòèðîâàíèåì <TITLE>Òåãè ôîðìàòèðîâàíèÿ Èìèäæ - îáðàç (çíàêîâûé ñèìâîë ôîòîðåêëàìíîãî óñïåõà è ðåêëàìíîãî áèçíåñà, óñòîé÷èâûé ïðåñòèæ èñêóññòâà ôîòîðåêëàìû, ïîëíîìàñøòàáíàÿ ïðîôåññèîíàëüíàÿ êîìïåòåíòíîñòü êîìàíäû ôîòîðåêëàìèñòîâ è èõ ëèäåðà, ôèëîñîôèÿ èíäèâèäóàëüíîé ïîçèöèè ôîòîðåêëàìíîãî òâîð÷åñòâà), èñêëþ÷èòåëüíûé è êà÷åñòâåííûé ïðèçíàê â ðÿäó èíûõ ïîäîáèé, âïå÷àòëåíèå, êîòîðîå ñâîéñòâåííî äàííîìó òîâàðó/óñëóãå, ðåêëàìíîìó àãåíòñòâó, ìàñòåðó-ôîòîðåêëàìèñòó, ôîòîðåêëàìíîé àêöèè, ðåêëàìíîé êîðïîðàöèè Èíòåðíåò-óñëóã.

Ðèñ. 2.20. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåã

Òåã ïîÿâèëñÿ â HTML âåðñèè 2.0, ÷àùå âñåãî ñîäåðæèìîå äàííîãî òåãà âûâîäèòñÿ êóðñèâîì.

Èñïîëüçîâàíèå ìîíîøèðèííûõ øðèôòîâ Íàäïèñè, âûïîëíåííûå ìîíîøèðèííûìè øðèôòàìè, ñîçäàþòñÿ ñ ïîìîùüþ òåãîâ , è <SAMP>. Ðåçóëüòàòû ïðèìåíåíèÿ ýòèõ òåãîâ îáû÷íî èäåíòè÷íû. Òåã èñïîëüçóåòñÿ ñ öåëüþ äîïîëíèòåëüíîãî âûäåëåíèÿ ôðàãìåíòîâ ïðîãðàììíîãî êîäà ìîíîøèðèííûì øðèôòîì. Äàííûé ýëåìåíò ïðåäïî÷òèòåëüíåå, ÷åì ýëåìåíò (ñì. ðàçäåë «Çàäàíèå íà÷åðòàíèÿ»). Ñèíòàêñèñ: Êîä

Ïðèìåð èñïîëüçîâàíèÿ ýòîãî òåãà ìîæíî ïîñìîòðåòü íà ðèñ. 2.21, à êîä ïðîãðàììû — â ëèñòèíãå 2.21. Ëèñòèíã 2.21. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåã <TITLE>Òåãè ôîðìàòèðîâàíèÿ Ïðîìîóøí - ïðîäâèæåíèå ïðîäàæ - êîìïëåêñ ðàçëè÷íûõ ìåð ñòèìóëèðîâàíèÿ ïîêóïêè òîâàðîâ. Ïðîìîóøí âêëþ÷àåò â ñåáÿ òàêèå ìåòîäû, êàê êóïîíèðîâàíèå, ïðîäàæè ñî ñêèäêîé, ëîòåðåè, âèêòîðèíû, ïðåäñòàâëåíèå áåñïëàòíûõ îáðàçöîâ.

Óðîê 2. Òåêñò

Ðèñ. 2.21. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåã

Òåã ïîÿâèëñÿ â HTML âåðñèè 2.0; ÷àùå âñåãî ñîäåðæèìîå äàííîãî òåãà âûâîäèòñÿ ìîíîøèðèííûì øðèôòîì. Òåã èñïîëüçóåòñÿ ñ öåëüþ âûäåëåíèÿ äèàëîãà ïîëüçîâàòåëÿ ñ êîìïüþòåðîì. Ñèíòàêñèñ: Ââîä ñ êëàâèàòóðû

Ïðèìåð ïðèìåíåíèÿ ýòîãî òåãà ìîæíî ïîñìîòðåòü íà ðèñ. 2.22, à êîä ïðîãðàììû — â ëèñòèíãå 2.22.

Ðèñ. 2.22. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåã

Ëèñòèíã 2.22. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåã <TITLE>Òåãè ôîðìàòèðîâàíèÿ Èìèäæ - ìîäèôèêàöèÿ îáðàçà ëè÷íîñòè, ôèðìû, òîâàðà ïóòåì ñãóùåíèÿ êðàñîê, ïðèóêðàøèâàíèÿ èëè î÷åðíåíèÿ. Òåîðèÿ ñîçäàíèÿ èìèäæåé èìåíóåòñÿ èìèäæåëîãèåé, èëè èêîíèêîé.

Òåã ïîÿâèëñÿ â HTML âåðñèè 2.0. ×àùå âñåãî ñîäåðæèìîå äàííîãî òåãà âûâîäèòñÿ ìîíîøèðèííûì øðèôòîì. Òåã <SAMP> èñïîëüçóåòñÿ ñ öåëüþ âûäåëåíèÿ äèàëîãà ïîëüçîâàòåëÿ ñ êîìïüþòåðîì. Ñèíòàêñèñ:

Äîáàâëåíèå òåêñòà ñ äðóãîé ñòðàíèöû

<SAMP> Ñèñòåìíîå ñîîáùåíèå êîìïüþòåðà

Ïðèìåð èñïîëüçîâàíèÿ ýòîãî òåãà ìîæíî ïîñìîòðåòü íà ðèñ. 2.23, à êîä ïðîãðàììû — â ëèñòèíãå 2.23. Ëèñòèíã 2.23. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåã <SAMP> <TITLE>Òåãè ôîðìàòèðîâàíèÿ ñèìâîëîâ Êîðïîðàòèâíàÿ ðåêëàìà – <SAMP>ðåêëàìà, ñîçäàþùàÿ ïîòðåáíîñòü íå â êîíêðåòíîé ìàðêå òîâàðà, à â ïîëíîì òîâàðíîì àññîðòèìåíòå.

Ðèñ. 2.23. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåã <SAMP>

Òåã <SAMP> ïîÿâèëñÿ â HTML âåðñèè 2.0. Îáû÷íî ñîäåðæèìîå äàííîãî òåãà îòîáðàæàåòñÿ ìîíîøèðèííûì øðèôòîì.

Äîáàâëåíèå òåêñòà ñ äðóãîé ñòðàíèöû Òåã ïîçâîëÿåò âûâåñòè íà ñòðàíèöå òåêñò ñ äðóãîé ñòðàíèöû, óêàçàâ åå àäðåñ. Îïðåäåëÿåò è îòîáðàæàåò òåêñò, êîòîðûé áûë âêëþ÷åí â äîêóìåíò ïî ñðàâíåíèþ ñ åãî ïðåäûäóùåé âåðñèåé. Âèçóàëüíî âñòàâëåííûé òåêñò âûäåëÿåòñÿ ïîä÷åðêèâàíèåì, íàïðèìåð: (äîñòóïíûé ôðàãìåíò òåêñòà)

Äëÿ âûâîäà äàòû ïðåäóñìîòðåí àòðèáóò DATETIME. Ïðèìåð ìîæíî ïîñìîòðåòü íà ðèñ. 2.24, à êîä ïðîãðàììû — â ëèñòèíãå 2.24. Ëèñòèíã 2.24. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåã <TITLE>Ïðèìåð âñòàâêè ÄÎÑÒÓÏÍÛÉ ÔÐÀÃÌÅÍÒ

Äàííûé òåã ïîÿâèëñÿ â HTML âåðñèè 4.0. Îí ìîæåò áûòü ýëåìåíòîì áëî÷íîãî ëèáî òåêñòîâîãî óðîâíÿ. Èçìåíåíèå âî âëîæåííîì áëîêîâîì ñîäåðæàíèè äîëæíî âûïîëíÿòüñÿ íà íèæíåì óðîâíå.

Óðîê 2. Òåêñò

Ðèñ. 2.24. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåã

Ðàññòàíîâêà ïðîáåëîâ Åñëè íàáðàòü òåêñò â Áëîêíîòå è ðàññòàâèòü â íåì ìíîæåñòâî ïðîáåëîâ, òî áðàóçåð ïðîèãíîðèðóåò ýòè ïðîáåëû è ñîêðàòèò èõ äî ìèíèìóìà, à åñëè âîñïîëüçîâàòüñÿ òåãîì , êîòîðûé âûâîäèò áëîê òåêñòà ìîíîøèðèííûì øðèôòîì, òî òåêñò îòðàçèòñÿ òàêèì, êàê îí åñòü, ñî âñåìè ïðîáåëàìè è ò. ä. Ïðèìåð òåêñòà ñî ìíîæåñòâîì ïðîáåëîâ, îêðóæåííîãî òåãàìè è , ìîæíî ïîñìîòðåòü íà ðèñ. 2.25, à êîä ïðîãðàììû — â ëèñòèíãå 2.25.

Ðèñ. 2.25. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåêñò è òåãè

Ëèñòèíã 2.25. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåêñò è òåãè <TITLE>Öèòàòà Ðåêëàìà - îäíà èç ôîðì ìàðêåòèíãîâûõ êîììóíèêàöèé, Îïëà÷åííàÿ ðåêëàìîäàòåëåì, èìåþùàÿ íåëè÷íûé õàðàêòåð, ðàñïðîñòðàíÿåìàÿ ÷åðåç ÑÌÈ ñ öåëüþ îêàçàòü âîçäåéñòâèå íà öåëåâóþ àóäèòîðèþ. Ñóùåñòâóþò ñëåäóþùèå âèäû ðåêëàìû: òîâàðíàÿ, êîðïîðàòèâíàÿ, ñîöèàëüíàÿ, ïîëèòè÷åñêàÿ.

Ïîäâåäåì èòîãè

Ïîäâåäåì èòîãè Â ýòîì óðîêå ðàññìàòðèâàþòñÿ îñíîâíûå òåãè, ïðåäíàçíà÷åííûå äëÿ ðàáîòû ñ òåêñòîì. Òåã ïðåäíàçíà÷åí äëÿ ñîçäàíèÿ çàãîëîâêîâ. Òåãè , ,
, , , , , , , , <STRIKE>, , , , , , , , , , <SAMP>, , , , , , , , <S> ïîçâîëÿþò ôîðìàòèðîâàòü òåêñò, èçìåíÿòü åãî öâåò, êðàñèâî ðàñïîëàãàòü íà ñòðàíèöå. Äëÿ ðàçðûâà ñòðîê ñëóæàò òåãè
è . Òåãè è èñïîëüçóþòñÿ äëÿ ñîçäàíèÿ âñïëûâàþùèõ ïîäñêàçîê.

Óðîê 3 Ãðàôèêà Îäíà èç íàèáîëåå ïðèâëåêàòåëüíûõ ÷åðò WWW — âîçìîæíîñòü âêëþ÷åíèÿ ññûëîê íà ãðàôè÷åñêèå ôàéëû â HTML-äîêóìåíò. Ãðàôèêà — ëó÷øåå óêðàøåíèå âåá-óçëà. Ïîä ãðàôèêîé ïîäðàçóìåâàþò çíà÷êè, ðèñóíêè, ôîòîãðàôèè è êàðòû èçîáðàæåíèé, çàíèìàþùèå ÷àñòü îêíà áðàóçåðà. Ïðè ðàçìåùåíèè ãðàôèêè íà âåá-ñòðàíèöå íåîáõîäèìî ñëåäèòü çà òåì, ÷òîáû ðàçìåð ãðàôè÷åñêèõ ôàéëîâ áûë êàê ìîæíî ìåíüøå. Õîòÿ â ïðèíöèïå ðàçìåðû ãðàôè÷åñêèõ ôàéëîâ â áàéòàõ ìîãóò áûòü íåîãðàíè÷åííûìè, ñëåäóåò ïîìíèòü, ÷òî ïåðåäà÷à áîëüøîãî ôàéëà ìîæåò çàíÿòü î÷åíü ìíîãî âðåìåíè, îñîáåííî ïðè íèçêîé ïðîïóñêíîé ñïîñîáíîñòè ëèíèé. Åñëè òîò, êòî ñìîòðèò âàøó âåá-ñòðàíèöó, ïëàòèò äåíüãè çà âðåìÿ íàõîæäåíèÿ â Èíòåðíåòå, âðÿä ëè îí çàõî÷åò ñìîòðåòü âàøè ñëåäóþùèå ñòðàíèöû, ó÷èòûâàÿ, ÷òî ïåðâàÿ ñòðàíèöà çàãðóæàåòñÿ î÷åíü äîëãî. Â ýòîì óðîêå áóäóò ðàññìîòðåíû ïðèåìû ðàáîòû ñ ãðàôèêîé.

Ðàçìåùåíèå ãðàôèêè íà âåá-ñòðàíèöå

Ðàçìåùåíèå ãðàôèêè íà âåá-ñòðàíèöå Äëÿ âñòàâêè ãðàôèêè â âåá-ñòðàíèöó èñïîëüçóåòñÿ òåã . Ãðàôèêà ïîçâîëÿåò çíà÷èòåëüíî óëó÷øèòü âíåøíèé âèä è ôóíêöèîíàëüíîñòü äîêóìåíòîâ. Òåã (îò àíãë. image — èçîáðàæåíèå) ïîÿâèëñÿ â HTML âåðñèè 2.0. Îí èìååò àòðèáóòû SRC, ALT, LONGDESC, HEIGHT, WIDTH, USEMAP, ISMAP, ALIGN, BORDER, HSPACE, VSPACE. Ïðèìåð: .

m Àòðèáóò SRC. Àòðèáóò SRC (îò àíãë. source — èñòî÷íèê) îïðåäåëÿåò ìåñòîðàñïîëîæåíèå èçîáðàæåíèÿ, âêëþ÷àåìîãî â ñîñòàâ äîêóìåíòà. URL — îáÿçàòåëüíûé ïàðàìåòð, êîòîðûé óêàçûâàåò áðàóçåðó, ãäå íàõîäèòñÿ ðèñóíîê. Ðèñóíîê äîëæåí õðàíèòüñÿ â ãðàôè÷åñêîì ôîðìàòå, íàïðèìåð â ôîðìàòå GIF èëè JPG. Åñëè ãðàôè÷åñêèé ôàéë íàõîäèòñÿ â òîì æå êàòàëîãå, ÷òî è ñîäåðæàùèé åãî HTML-äîêóìåíò, äîñòàòî÷íî óêàçàòü òîëüêî èìÿ ýòîãî ôàéëà, íàïðèìåð:

Åñëè ãðàôè÷åñêèé ôàéë íàõîäèòñÿ íà òîì æå ñåðâåðå, ÷òî è ñîäåðæàùèé åãî HTML-äîêóìåíò, íî â äðóãîì êàòàëîãå, ñëåäóåò óêàçàòü èìÿ êàòàëîãà è èìÿ ýòîãî ôàéëà, íàïðèìåð: .

Åñëè ãðàôè÷åñêèé ôàéë íàõîäèòñÿ íå íà òîì ñåðâåðå, íà êîòîðîì íàõîäèòñÿ ñîäåðæàùèé åãî HTML-äîêóìåíò, íåîáõîäèìî óêàçàòü ïîëíûé àäðåñ ýòîãî ôàéëà, íàïðèìåð: .

m Àòðèáóò ALT. Íåîáÿçàòåëüíûé àòðèáóò ALT çàäàåò àëüòåðíàòèâíûé òåêñò, êîòîðûé âûâîäèòñÿ áðàóçåðîì, ïîêà èäåò çàãðóçêà èçîáðàæåíèÿ (èëè áðàóçåðîì, íå ïîääåðæèâàþùèì îòîáðàæåíèå ãðàôèêè). Îáû÷íî ýòî êîðîòêîå îïèñàíèå èçîáðàæåíèÿ, êîòîðîå ïîëüçîâàòåëü ìîã áû èëè ñìîæåò óâèäåòü íà ýêðàíå. Åñëè ýòîò àòðèáóò íå çàäàí, íà ìåñòå èçîáðàæåíèÿ áîëüøèíñòâî áðàóçåðîâ âûâîäÿò çíà÷îê, ùåëêíóâ íà êîòîðîì, ïîëüçîâàòåëü ñìîæåò óâèäåòü èçîáðàæåíèå. Àòðèáóò ALT ðåêîìåíäóåòñÿ óêàçûâàòü, åñëè âàøè ïîëüçîâàòåëè ïðèìåíÿþò áðàóçåð, íå ïîääåðæèâàþùèé ãðàôè÷åñêèé ðåæèì, íàïðèìåð Lunix. m Àòðèáóò LONGDESC. Íåîáÿçàòåëüíûé àòðèáóò LONGDESC çàäàåò ññûëêó íà óäàëåííûé ðåñóðñ. m Àòðèáóò HEIGTH. Íåîáÿçàòåëüíûé àòðèáóò HEIGTH îïðåäåëÿåò âûñîòó ðèñóíêà â ïèêñåëàõ. Åñëè äàííûé ïàðàìåòð íå óêàçàí, èñïîëüçóåòñÿ îðèãèíàëüíàÿ âûñîòà ðèñóíêà. Ýòîò ïàðàìåòð ïîçâîëÿåò ñæèìàòü èëè ðàñòÿãèâàòü èçîáðàæåíèÿ ïî âåðòèêàëè, ÷òî äàåò âîçìîæíîñòü òî÷íåå êîíòðîëèðîâàòü âíåøíèé âèä äîêóìåíòà. Îäíàêî íåêîòîðûå áðàóçåðû íå ïîääåðæèâàþò äàííûé ïàðàìåòð. Èíîãäà ýêðàííîå ðàçðåøåíèå íà ðàçíûõ êîìïüþòåðàõ ìîæåò áûòü ðàçíûì, ïîýòîìó ïðè çàäàíèè àáñîëþòíîé âåëè÷èíû ãðàôè÷åñêîãî îáúåêòà ñëåäóåò áûòü âíèìàòåëüíûì. m Àòðèáóò WIDTH. Íåîáÿçàòåëüíûé àòðèáóò WIDTH èñïîëüçóåòñÿ äëÿ óêàçàíèÿ øèðèíû ðèñóíêà â ïèêñåëàõ.

Óðîê 3. Ãðàôèêà

m Àòðèáóò ALIGN. Íåîáÿçàòåëüíûé àòðèáóò ALIGN èñïîëüçóåòñÿ äëÿ òî÷íîãî ïîçèöèîíèðîâàíèÿ îáúåêòîâ íà ýêðàíå. Äîñòóïíûå çíà÷åíèÿ: q top — âåðõíèé êðàé îáúåêòà âûðàâíèâàåòñÿ ïî âåðõíåìó êðàþ ñòðîêè; q middle — öåíòð îáúåêòà âûðàâíèâàåòñÿ ïî áàçîâîé ëèíèè ñòðîêè; q bottom — íèæíèé êðàé îáúåêòà âûðàâíèâàåòñÿ ïî áàçîâîé ëèíèè ñòðîêè; q left — îáúåêò âûðàâíèâàåòñÿ ïî ëåâîìó êðàþ, ïðè ýòîì âîçìîæíî îáòåêàíèå îáúåêòà òåêñòîì; q right — îáúåêò âûðàâíèâàåòñÿ ïî ïðàâîìó êðàþ, ïðè ýòîì âîçìîæíî îáòåêàíèå îáúåêòà òåêñòîì. Åñëè äàííûé ïàðàìåòð íå óêàçàí, áîëüøèíñòâî áðàóçåðîâ ðàñïîëàãàåò èçîáðàæåíèå â ëåâîé ÷àñòè ýêðàíà, à òåêñò — ñïðàâà îò íåãî. m Àòðèáóò BORDER. Àòðèáóò BORDER çàäàåò òîëùèíó îáðàìëåíèÿ äëÿ èçîáðàæåíèÿ. m Àòðèáóò VSPACE. Àòðèáóò VSPACE ïîçâîëÿåò çàäàòü ðàçìåð â ïèêñåëàõ ïóñòîãî ïðîñòðàíñòâà íàä è ïîä èçîáðàæåíèåì, ÷òîáû òåêñò «íå íàåçæàë» íà èçîáðàæåíèå. m Àòðèáóò HSPACE. Àòðèáóò HSPACE ïîçâîëÿåò çàäàòü ðàçìåð â ïèêñåëàõ ïóñòîãî ïðîñòðàíñòâà ñëåâà è ñïðàâà îò èçîáðàæåíèÿ, ÷òîáû òåêñò «íå íàåçæàë» íà èçîáðàæåíèå.

Ôîðìàòû ãðàôè÷åñêèõ ôàéëîâ Áîëüøèíñòâî ôîðìàòîâ ôàéëîâ â êîìïüþòåðíîé ãðàôèêå ïîçâîëÿåò õðàíèòü èíôîðìàöèþ îá èçîáðàæåíèè êàê î íàáîðå òî÷åê. Òî÷íî òàê æå (â âèäå íàáîðà òî÷åê) èçîáðàæåíèÿ âûâîäÿòñÿ íà ýêðàí. Îáû÷íî â Èíòåðíåòå èñïîëüçóþòñÿ äâà ðàñòðîâûõ ôîðìàòà — GIF è JPEG. Êðîìå òîãî, â Èíòåðíåòå äîâîëüíî ìíîãî èçîáðàæåíèé, èìåþùèõ ôîðìàòû BMP è PCX. Ñïåöèàëèñòû ñ÷èòàþò, ÷òî äîâîëüíî áîëüøèå ïåðñïåêòèâû åñòü ó ôîðìàòà PNG — ñàìîãî ñîâðåìåííîãî ôîðìàòà ïåðåíîñèìîé ñåòåâîé ãðàôèêè.

Ôîðìàò GIF Ôîðìàò GIF (Graphic Interchange Format — ôîðìàò îáìåíà ãðàôè÷åñêèìè äàííûìè) ñëóæèò äëÿ çàïèñè è õðàíåíèÿ ðàñòðîâûõ ãðàôè÷åñêèõ èçîáðàæåíèé. Ýòîò ôîðìàò áûë ðàçðàáîòàí êîðïîðàöèåé Compuserve ñ èñïîëüçîâàíèåì òåõíîëîãèè Unisys. Ôîðìàò GIF ïðèìåíÿåòñÿ äëÿ õðàíåíèÿ 256-öâåòíûõ èçîáðàæåíèé (èëè èçîáðàæåíèé ñ ìåíüøèì êîëè÷åñòâîì öâåòîâ), ñæàòûõ ïî ìåòîäó Ëåìïåëà—Çèâà (LZW). Òîò æå ìåòîä ñæàòèÿ õàðàêòåðåí äëÿ àðõèâàòîðîâ ôàéëîâ. Ôîðìàò GIF äîëüøå äðóãèõ ïðåäñòàâëåí â Èíòåðíåòå è ïîääåðæèâàåòñÿ ðàçíûìè ãðàôè÷åñêèìè ðåäàêòîðàìè. Â íåì èñïîëüçóþòñÿ èíäåêñèðîâàííûå öâåòà. Âåðñèÿ GIF89a ýòîãî ôîðìàòà îáåñïå÷èâàåò âîçìîæíîñòü ÷åðåññòðî÷íîé ðàçâåðòêè, ÷òî ïîçâîëÿåò ïîñòåïåííî ïîâûøàòü êà÷åñòâî ïðèíÿòîãî ÷åðåç êàíàë ñâÿçè èçîáðàæåíèÿ. Ýòî ñàìûé ðàñïðîñòðàíåííûé ôîðìàò èçîáðàæåíèé â Èíòåðíåòå.

Ôîðìàòû ãðàôè÷åñêèõ ôàéëîâ

Èçîáðàæåíèÿ â ôîðìàòå GIF õðàíÿòñÿ â ôàéëàõ ñ ðàñøèðåíèåì .gif. Ê äîñòîèíñòâàì GIF-èçîáðàæåíèé îòíîñèòñÿ òî, ÷òî âèä èçîáðàæåíèÿ íå çàâèñèò îò áðàóçåðà è ïëàòôîðìû. Ëó÷øå âñåãî îòîáðàæàþòñÿ ÷åðòåæè, ðèñóíêè, èçîáðàæåíèÿ ñ íåáîëüøèì êîëè÷åñòâîì îäíîðîäíûõ öâåòîâ, ïðîçðà÷íûå èçîáðàæåíèÿ è àíèìàöèîííûå ïîñëåäîâàòåëüíîñòè. Â GIF-èçîáðàæåíèÿõ èñïîëüçóåòñÿ àëãîðèòì ñæàòèÿ áåç ïîòåðè èíôîðìàöèè.

Ôîðìàò JPEG Ïðèìåíÿþùèéñÿ â ôîðìàòå JPEG (Joint Photographic Expert Group — îáúåäèíåííàÿ ãðóïïà ýêñïåðòîâ â îáëàñòè ôîòîãðàôèè) àëãîðèòì îáðàáîòêè èçîáðàæåíèé ðàçðàáîòàí ãðóïïîé ýêñïåðòîâ êàê ñðåäñòâî ñæàòèÿ èçîáðàæåíèé ñ ïàëèòðîé 24 áèòà íà ïèêñåë, ÷òî îáåñïå÷èâàåò îòîáðàæåíèå 16,7 ìèëëèîíà öâåòîâ. JPEG — îäèí èç ñàìûõ ìîùíûõ àëãîðèòìîâ. Ïðàêòè÷åñêè îí ÿâëÿåòñÿ ñòàíäàðòîì äå-ôàêòî äëÿ ïîëíîöâåòíûõ èçîáðàæåíèé. Ôîðìàò JPEG áûë ñîçäàí äëÿ òîãî, ÷òîáû èçáàâèòüñÿ îò íåäîñòàòêîâ ôîðìàòà GIF. Àëãîðèòì îïåðèðóåò îáëàñòÿìè 8´8 ïèêñåëîâ, â êîòîðûõ ÿðêîñòü è öâåò ïëàâíî ìåíÿþòñÿ. Ñæàòèå â ôîðìàòå JPEG îñóùåñòâëÿåòñÿ çà ñ÷åò òîãî, ÷òî â ðåàëüíûõ èçîáðàæåíèÿõ, â ÷àñòíîñòè â ôîòîãðàôèÿõ, öâåò îáû÷íî ìåíÿåòñÿ äîñòàòî÷íî ïëàâíî. Îáåñïå÷èâàåòñÿ âûñîêèé êîýôôèöèåíò ñæàòèÿ, çíà÷åíèå êîòîðîãî äîñòèãàåò 100 è çàâèñèò îò äîïóñòèìîãî óðîâíÿ ïîòåðü èçîáðàçèòåëüíîé èíôîðìàöèè. Ôîðìàò øèðîêî èñïîëüçóåòñÿ â HTML-äîêóìåíòàõ è äëÿ ïåðåäà÷è ãðàôèêè ïî ñåòè. Ñîõðàíÿåò ïàðàìåòðû ãðàôèêè â öâåòîâîé ìîäåëè RGB. Èçîáðàæåíèÿ â ôîðìàòå JPEG õðàíÿòñÿ â ôàéëàõ ñ ðàñøèðåíèåì .jpg. Â ôîðìàòå JPEG èñïîëüçóþòñÿ àëãîðèòìû ñæàòèÿ ñ ïîòåðåé èíôîðìàöèè. Ïðè ñæàòèè èç èçîáðàæåíèÿ èñêëþ÷àþòñÿ äàííûå, êîòîðûå ñ÷èòàþòñÿ íåñóùåñòâåííûìè. Ïðè ýòîì åñòü ðèñê ïîëó÷èòü íå÷åòêîå, ðàçìûòîå èçîáðàæåíèå ñ èñêàæåíèåì äåòàëåé.

Ôîðìàò PNG Ïîñëåäíåå âðåìÿ ïîëó÷èëè ðàñïðîñòðàíåíèå ôàéëû â ôîðìàòå PNG (Portable Network Graphics — ïåðåíîñèìàÿ ñåòåâàÿ ãðàôèêà). Ñàìî íàçâàíèå ôîðìàòà ãîâîðèò î åãî íàçíà÷åíèè — èñïîëüçîâàíèè ïðè ïåðåäà÷å èçîáðàæåíèé â ñåòÿõ. Ôîðìàò ïîääåðæèâàåò ïîëíîöâåòíûå RGB-èçîáðàæåíèÿ è èíäåêñèðîâàííûå èçîáðàæåíèÿ. Äîïóñêàåò íàëè÷èå äîïîëíèòåëüíîãî êàíàëà äëÿ õðàíåíèÿ ìàñêè îáðåçêè. Èìååò ýôôåêòèâíûé àëãîðèòì ñæàòèÿ áåç ïîòåðè èíôîðìàöèè.

Ôîðìàò BMP Ïåðâûì ãðàôè÷åñêèì ôîðìàòîì äëÿ IBM-ñîâìåñòèìûõ êîìïüþòåðîâ, íàøåäøèì øèðîêîå ïðèìåíåíèå, áûë ôîðìàò BMP (Bit Map — áèòîâàÿ êàðòà). Ìîæíî ñêàçàòü, ÷òî ñ íåãî âñå íà÷àëîñü. Â ôîðìàòå BMP ïåðâîíà÷àëüíî èñïîëüçîâàëîñü ïðîñòåéøåå êîäèðîâàíèå — ïî ïèêñåëàì (ñàìîå íåýêîíîìíîå). Ïèêñåëû îáõîäèëèñü ïîñëåäîâàòåëüíî ïî ñòðîêàì, íà÷èíàÿ ñ íèæíåãî ëåâîãî óãëà ãðàôè÷åñêîãî èçîáðàæåíèÿ. Ôàéëû èìåííî ýòîãî ôîðìàòà ïîääåðæèâàëèñü ïåðâûìè âåðñèÿìè

Óðîê 3. Ãðàôèêà

îáîëî÷êè Windows. Â íèõ èñïîëüçîâàëèñü òîëüêî èíäåêñèðîâàííûå öâåòà â êîëè÷åñòâå 256, òî åñòü îäèí ïèêñåë ïðåäñòàâëÿëñÿ îäíèì áàéòîì. Â äàëüíåéøåì ôîðìàò ñòàë ïðèìåíÿòüñÿ è äëÿ êîäèðîâàíèÿ ïîëíîöâåòíûõ èçîáðàæåíèé. Ýòî ñòàíäàðòíûé ôîðìàò ðàñòðîâîé ãðàôèêè. Ïîñêîëüêó BMP-ôàéëû ïðåäñòàâëÿþò ñîáîé «ðîäíîé» ôîðìàò ãðàôèêè äëÿ Microsoft Windows, ïîäîáíûõ èçîáðàæåíèé â Èíòåðíåòå äîñòàòî÷íî ìíîãî.

Ôîðìàò PCX Ôîðìàò PCX èñïîëüçóåò òîëüêî èíäåêñèðîâàííûå ïàëèòðû. Îí áûë ðàçðàáîòàí ôèðìîé Z-soft ñïåöèàëüíî äëÿ ïàêåòà PaintBrush, à â äàëüíåéøåì ïîëó÷èë áîëåå øèðîêîå ðàñïðîñòðàíåíèå. Â íåì ïðåäóñìîòðåíî ñæàòèå, îáåñïå÷èâàþùåå áîëüøóþ êîìïàêòíîñòü ïî ñðàâíåíèþ ñ ôîðìàòîì BMP. Òåì íå ìåíåå ïðàêòè÷åñêè îí ïðèãîäåí òîëüêî äëÿ ïðîñòûõ èçîáðàæåíèé èëè èçîáðàæåíèé ñ èíäåêñèðîâàííûìè öâåòàìè.

Ïèêñåëû è ðàçðåøåíèå Â Èíòåðíåòå äëÿ ïåðåäà÷è èçîáðàæåíèé â îñíîâíîì èñïîëüçóåòñÿ ðàñòðîâàÿ ãðàôèêà. Ðàñòðîâàÿ ãðàôèêà — ýòî, âî-ïåðâûõ, ãðàôèêà, ïðåäñòàâëÿåìàÿ â êîìïüþòåðå â âèäå ìíîæåñòâà òî÷åê (ïèêñåëîâ), âî-âòîðûõ, ôàéë îïðåäåëåííîãî ôîðìàòà. Äëÿ ðàñòðîâîé ãðàôèêè âàæíîé õàðàêòåðèñòèêîé ÿâëÿåòñÿ ðàçðåøåíèå èçîáðàæåíèÿ. Îäíà è òà æå êàðòèíêà ìîæåò áûòü ïðåäñòàâëåíà ñ ëó÷øèì èëè õóäøèì êà÷åñòâîì â ñîîòâåòñòâèè ñ êîëè÷åñòâîì òî÷åê íà åäèíèöó äëèíû. Ðàçðåøåíèå — êîëè÷åñòâî òî÷åê íà åäèíèöó èçìåðåíèÿ: m dpi (dots per inch) — êîëè÷åñòâî òî÷åê íà äþéì; m ppi (points/pixels per inch) — êîëè÷åñòâî ïèêñåëîâ íà äþéì; m spi (samples per inch) — îïòè÷åñêîå, ïåðâîíà÷àëüíîå ðàçðåøåíèå ñêàíåðà, îçíà÷àþùåå êîëè÷åñòâî ïðîá íà äþéì, òî åñòü ÷èñëî «ïðîñìîòðîâ» ñêàíåðîì èçîáðàæåíèÿ âî âðåìÿ ñêàíèðîâàíèÿ. Dpi — íàèáîëåå ÷àñòî èñïîëüçóåìûé òåðìèí, êîòîðûé îòíîñèòñÿ òîëüêî ê ìàëåíüêèì òî÷êàì, ñîçäàâàåìûì âûõîäíûì óñòðîéñòâîì. Òî÷êè âûõîäíîãî óñòðîéñòâà íè÷åãî îáùåãî íå èìåþò ñ ðàçðåøåíèåì èçîáðàæåíèÿ, îíè ñâÿçàíû ñ ìèíèìàëüíûì âîñïðîèçâîäèìûì ïðèíòåðîì ðàçìåðîì òî÷êè. Ðàçðåøåíèå èëëþñòðàöèè îáû÷íî èçìåðÿåòñÿ â dpi. ×åì áîëüøå ðàçðåøåíèå, òåì áîëåå êà÷åñòâåííûì ÿâëÿåòñÿ èçîáðàæåíèå, íî è òåì áîëüøèé ðàçìåð èìååò ôàéë, â êîòîðîì èçîáðàæåíèå ñîõðàíÿåòñÿ. Ðàçëè÷àþò ðàçðåøåíèå èçîáðàæåíèÿ, ðàçðåøåíèå ýêðàíà è ðàçðåøåíèå ïðèíòåðà. Ìîíèòîðû, âûïóñêàåìûå ðàçëè÷íûìè ôèðìàìè, êàê ïðàâèëî, èìåþò ñòàíäàðòíûå ðàçðåøåíèÿ: 640´470, 700´600, 1024´768, 1270´1024, 1600´1270, 1920´1600 òî÷åê. Ðàññòîÿíèå ìåæäó ëþìèíîôîðàìè õîðîøåãî ìîíèòîðà ñîñòàâëÿåò 0,2–0,25 ìì. Êîíå÷íî, äëÿ êà÷åñòâåííîãî äèçàéíà òðåáóåòñÿ ìîíèòîð ñ áîëüøèì ðàçðåøåíè-

Ïðèìåðû ðàçìåùåíèÿ ãðàôèêè íà âåá-ñòðàíèöå

åì. Èíîãäà äèçàéíåð ìîæåò ðåäàêòèðîâàòü èçîáðàæåíèå ïîïèêñåëüíî. Ðàçðåøàþùàÿ ñïîñîáíîñòü ýêðàíà çàâèñèò îò ìîíèòîðà è âèäåîàäàïòåðà êîìïüþòåðà. Ñòàòè÷åñêèå ðàñòðîâûå èçîáðàæåíèÿ ïðåäñòàâëÿþò ñîáîé äâóõìåðíûé ìàññèâ ÷èñåë. Ýëåìåíòû ýòîãî ìàññèâà íàçûâàþò ïèêñåëàìè (îò àíãë. pixel — picture element, èëè ýëåìåíò èçîáðàæåíèÿ). Ïèêñåë — ìèíèìàëüíûé àäðåñóåìûé ýëåìåíò äâóõìåðíîãî ðàñòðîâîãî èçîáðàæåíèÿ; îäíà òî÷êà èçîáðàæåíèÿ.

Ïðèìåðû ðàçìåùåíèÿ ãðàôèêè íà âåá-ñòðàíèöå Ïðåæäå ÷åì ðàçìåùàòü èçîáðàæåíèå íà âåá-ñòðàíèöå, ïðîâåäåì ýêñïåðèìåíò. Âîçüìåì ëþáèòåëüñêóþ ôîòîãðàôèþ âûñîòîé 11 ñì è øèðèíîé 13 ñì. Êàê îíà áóäåò âûãëÿäåòü íà ýêðàíå? Åñëè ìû îòñêàíèðóåì ôîòîãðàôèþ â òðåõ âàðèàíòàõ, â ïåðâîì âûáåðåì öâåòíîé ðåæèì ñ ðàçðåøåíèåì 300 dpi, âî âòîðîì — ÷åðíî-áåëûé ðåæèì ñ ðàçðåøåíèåì 300 dpi, â òðåòüåì — öâåòíîé ðåæèì ñ ðàçðåøåíèåì 72 dpi, òî â ïåðâûõ äâóõ âàðèàíòàõ îòñêàíèðîâàííàÿ ôîòîãðàôèÿ áóäåò èìåòü ðàçìåð 1304´1479 ïèêñåëîâ, à â òðåòüåì âàðèàíòå — 313´355 ïèêñåëîâ.

Ðèñ. 3.1. Êóïîëà íà âåá-ñòðàíèöå

Óðîê 3. Ãðàôèêà

Ïîñêîëüêó ðàçìåðû ôîòîãðàôèè â ïèêñåëàõ â ïåðâûõ äâóõ âàðèàíòàõ îêàçàëèñü áîëüøå ðàçìåðà ýêðàíà â ïèêñåëàõ (ðàçìåð, íàïðèìåð, ìîåãî ýêðàíà ñîñòàâëÿåò 768´1024 ïèêñåëîâ), ïðè ðàçìåùåíèè ôîòîãðàôèè íà âåá-ñòðàíèöå äëÿ åå ïðîñìîòðà ïîòðåáóþòñÿ ïîëîñû ïðîêðóòêè. Â òðåòüåì âàðèàíòå îòñêàíèðîâàííàÿ ôîòîãðàôèÿ çàíèìàåò òîëüêî ÷àñòü ýêðàíà. Òàêèì îáðàçîì, äëÿ èçîáðàæåíèé, ðàñïðîñòðàíÿåìûõ ÷åðåç Èíòåðíåò, îáû÷íî óñòàíàâëèâàåòñÿ ðàçðåøåíèå 72 dpi, à ðàçðåøåíèå â 300 dpi õàðàêòåðíî áîëüøå äëÿ ïå÷àòíûõ èçîáðàæåíèé. Íà ðèñ. 3.1 ïîêàçàí ïðèìåð ðàçìåùåíèÿ íà âåá-ñòðàíèöå ïðîèçâîëüíîãî èçîáðàæåíèÿ (îòñêàíèðîâàííîé ôîòîãðàôèè), ñîîòâåòñòâóþùèé êîä ïðèâåäåí â ëèñòèíãå 3.1. Ëèñòèíã 3.1. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû ñ èçîáðàæåíèåì öåðêâè <TITLE> Ðèñóíîê

Â ýòîì ïðèìåðå ïðè ðàçìåùåíèè èçîáðàæåíèÿ íà ñòðàíèöå ìû íå êàñàëèñü âîïðîñîâ åãî ðàçìåðîâ è ïîëîæåíèÿ íà ñòðàíèöå. Íà ñàìîì äåëå ýòè âîïðîñû íåîáõîäèìî ó÷èòûâàòü. Ðàçìåðû èçîáðàæåíèÿ ìîæíî óòî÷íèòü è ïðè íåîáõîäèìîñòè èçìåíèòü â ïðîãðàììå Adobe Photoshop.

Ðèñ. 3.2. Èçîáðàæåíèå ðîìàøêè íà âåá-ñòðàíèöå

Ïðèìåðû ðàçìåùåíèÿ ãðàôèêè íà âåá-ñòðàíèöå

Íà ðèñ. 3.2 ïîêàçàí ïðèìåð ðàçìåùåíèÿ èçîáðàæåíèÿ øèðèíîé 198 è âûñîòîé 155 ïèêñåëîâ (ëèñòèíã 3.2). Õîòÿ ëèñòèíãè 3.1 è 3.2 ïðàêòè÷åñêè ñîâïàäàþò, èçîáðàæåíèÿ èìåþò ðàçíûå ðàçìåðû â ïèêñåëàõ è ïîýòîìó çàíèìàþò ðàçíóþ ïëîùàäü. Ëèñòèíã 3.2. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû ñ èçîáðàæåíèåì ðîìàøêè <TITLE> Ðèñóíîê

Ïî óìîë÷àíèþ ðèñóíîê ðàçìåñòèëñÿ â ëåâîì âåðõíåì óãëó. Íà ðèñ. 3.3 ïîêàçàí åùå îäèí ïðèìåð ðàçìåùåíèÿ íà âåá-ñòðàíèöå èçîáðàæåíèÿ, íî íà ýòîò ðàç â êîäå çàäàíû çíà÷åíèÿ àòðèáóòîâ øèðèíû è âûñîòû (øèðèíà 281, âûñîòà 300 ïèêñåëîâ), à òàêæå óêàçàíà ïîäïèñü (ëèñòèíã 3.3).

Ðèñ. 3.3. Âåá-ñòðàíèöà ñ èçîáðàæåíèåì è ïîäïèñüþ

Óðîê 3. Ãðàôèêà

Ëèñòèíã 3.3. Ðàçìåùåíèå íà âåá-ñòðàíèöå èçîáðàæåíèÿ è ïîäïèñè <TITLE>Ðèñóíîê Àòëàíòû íà Ôîíòàíêå
Ðîññèÿ * Ñàíêò-Ïåòåðáóðã*Åùå îäíè àòëàíòû íà Ôîíòàíêå
Óãîë Íåâñêîãî ïðîñïåêòà è Íàáåðåæíîé ðåêè Ôîíòàíêè

Íà ðèñ. 3.4 ïîêàçàí ïðèìåð ðàçìåùåíèÿ ÷åòûðåõ èçîáðàæåíèé øèðèíîé 92 è âûñîòîé 114 ïèêñåëîâ êàæäîå â òàáëèöå (ëèñòèíã 3.4). Ïîäðîáíî ïðèíöèïû ðàáîòû ñ òàáëèöàìè áóäóò ðàññìîòðåíû äàëåå.

Ðèñ. 3.4. ×åòûðå ðèñóíêà â òàáëèöå

Âûðàâíèâàíèå èçîáðàæåíèé

Ëèñòèíã 3.4. Ïðèìåð ñîçäàíèÿ ÷åòûðåõ ðèñóíêîâ â òàáëèöå <TITLE>×åòûðå ðèñóíêà â òàáëèöå

Âûðàâíèâàíèå èçîáðàæåíèé Ñ ïîìîùüþ àòðèáóòà ALIGN ìîæíî çàäàòü ñïîñîá âûðàâíèâàíèÿ èçîáðàæåíèÿ íà âåá-ñòðàíèöå. Íà ðèñ. 3.5 ïåðâûé ðèñóíîê âûðîâíåí âïðàâî, âòîðîé — âëåâî (ëèñòèíã 3.5).

Ðèñ. 3.5. Ïðèìåð âûðàâíèâàíèÿ èçîáðàæåíèé íà âåá-ñòðàíèöå

Óðîê 3. Ãðàôèêà

Ëèñòèíã 3.5. Ïðèìåð âûðàâíèâàíèÿ èçîáðàæåíèé íà âåá-ñòðàíèöå <TITLE> Îáòåêàíèå ãðàôèêè òåêñòîìÎáòåêàíèå òåêñòîì îáúåêòîâ
ActiveMovie Stream - ýòî äîïîëíèòåëüíûé ïàêåò äëÿ ðàáîòû ñ Internet Explorer.
C ïîìîùüþ ýòîé ïðîãðàììû ìîæíî ïðîèãðûâàòü ôàéëû â ôîðìàòå ASF â òàêèõ íå ñëèøêîì áûñòðûõ ñåòÿõ, êàê Èíòåðíåò.
Çà ñ÷åò èíêàïñóëÿöèè â Active Movie Stream ìîæíî ýôôåêòèâíî ñèíõðîíèçèðîâàòü
è õðàíèòü íà ðàçëè÷íûõ ñåðâåðàõ ôàéëû â ïîïóëÿðíûõ ôîðìàòàõ ìóëüòèìåäèà,
òàêèõ êàê MPEG, AVI, WAV è Apple Quick Time
Íåîáõîäèìî ââåñòè â âåá-ñòðàíèöó çâóê, âèäåî è èíòåðàêòèâíîñòü. OLE îáúåêòíî-îðèåíòèðîâàííàÿ òåõíîëîãèÿ ñîçäàíèÿ ïðîãðàììíûõ îáúåêòîâ

Íåîáõîäèìî ââåñòè â âåá-ñòðàíèöó çâóê, âèäåî è èíòåðàêòèâíîñòü. OLE îáúåêòíî-îðèåíòèðîâàííàÿ òåõíîëîãèÿ ñîçäàíèÿ ïðîãðàììíûõ îáúåêòîâ

Êàðòû èçîáðàæåíèé Êàðòû èçîáðàæåíèé (image maps) ïîçâîëÿþò ïîëüçîâàòåëþ ñâÿçûâàòü ññûëêè íà äðóãèå äîêóìåíòû ñ îòäåëüíûìè ÷àñòÿìè èçîáðàæåíèé. Ùåëêàÿ ìûøüþ íà ÷àñòÿõ èçîáðàæåíèÿ, òàê íàçûâàåìûõ àêòèâíûõ îáëàñòÿõ (hot spots), ïîëüçîâàòåëü ìîæåò âûïîëíÿòü òå èëè èíûå äåéñòâèÿ, ïåðåõîäèòü ê äðóãèì äîêóìåíòàì è ò. ï. Åñëè ïîëüçîâàòåëü ïîçèöèîíèðóåò óêàçàòåëü ìûøè íà èçîáðàæåíèè, êîòîðîå ñ ïîìîùüþ àòðèáóòà ISMAP â òåãå îïðåäåëåíî êàê êàðòà èçîáðàæåíèÿ, è ùåëêàåò ëåâîé êíîïêîé ìûøè, òî êîîðäèíàòû òî÷êè ùåë÷êà ïåðåäàþòñÿ íà âåá-ñåðâåð. Ïðè ïîëó÷åíèè ýòèõ êîîðäèíàò ñåðâåð èùåò íà êàðòå àêòèâíóþ îáëàñòü, ñîäåðæàùóþ ýòè êîîðäèíàòû. Åñëè òàêàÿ îáëàñòü ñóùåñòâóåò, òî çàäàííûé URL-àäðåñ àêòèâèçèðóåòñÿ, è áðàóçåð ïîëüçîâàòåëÿ ïåðåõîäèò ïî ýòîìó àäðåñó íà íîâóþ ñòðàíèöó. Îïèñàííûé âàðèàíò ôóíêöèîíèðîâàíèÿ õàðàêòåðåí äëÿ ñëó÷àÿ, êîãäà êàðòà èçîáðàæåíèÿ ðàçìåùàåòñÿ íà ñåðâåðå, îäíàêî îíà òàêæå ìîæåò ðàçìåùàòüñÿ íà êëèåíòñêîì êîìïüþòåðå. Â ýòîì ñëó÷àå áðàóçåð ñàìîñòîÿòåëüíî âûÿñíÿåò URL-àäðåñ íóæíîé ñòðàíèöû è ïåðåäàåò ñåðâåðó íå êîîðäèíàòû òî÷êè ùåë÷êà, à ýòîò àäðåñ. Âòîðîé ñëó÷àé ïðåäïî÷òèòåëüíåå, òàê êàê íà ñåðâåðå íå ïðèõîäèòñÿ çàïóñêàòü ïðîãðàììó (ñöåíàðèé), âûïîëíÿþùóþ ïðîñìîòð èçîáðàæåíèÿ ñ öåëüþ îïðåäåëåíèÿ àêòèâíîé îáëàñòè. Ïî ñîîáðàæåíèÿì áåçîïàñíîñòè ìíîãèå ñèñòåìíûå àäìè-

Êàðòû èçîáðàæåíèé

íèñòðàòîðû íå ðàçðåøàþò ïîñòîðîííèì ðàáîòàòü íà ñåðâåðå è çàïèñûâàòü ñöåíàðèè â êàòàëîãè. Ê ñîæàëåíèþ, ñ êàðòàìè èçîáðàæåíèé, ôóíêöèîíèðóþùèìè íà êëèåíòñêîé ìàøèíå, ìîãóò ðàáîòàòü íå âñå áðàóçåðû.

Òåã <MAP> Òåã <MAP> ïðèìåíÿåòñÿ äëÿ ïðåäñòàâëåíèÿ ãðàôè÷åñêîãî èçîáðàæåíèÿ â âèäå êàðòû ñ àêòèâíûìè îáëàñòÿìè. Àêòèâíûå îáëàñòè ìîæíî èäåíòèôèöèðîâàòü ïî âñïëûâàþùåé ïîäñêàçêå, êîòîðàÿ ïîÿâëÿåòñÿ ïðè íàâåäåíèè íà òàêóþ îáëàñòü óêàçàòåëÿ ìûøè. Äàííûé òåã ïîÿâèëñÿ â HTML âåðñèè 3.2. Êîíòåéíåð, ñîñòîÿùèé èç òåãîâ <MAP> è , ÿâëÿåòñÿ áëîêîì îïèñàòåëåé àêòèâíûõ îáëàñòåé. Òåã <MAP> ìîæåò áûòü ñâÿçàí ñ òåãîì èëè òåãîì ñ ïîìîùüþ àòðèáóòà USEMAP. ×òîáû âêëþ÷èòü ïîääåðæêó êàðòû èçîáðàæåíèÿ, íåîáõîäèìî ââåñòè àòðèáóò USEMAP â òåã :

Àòðèáóò USEMAP óêàçûâàåò, â êàêîì ìåñòå íàõîäèòñÿ êàðòà èçîáðàæåíèÿ. Êàðòà èçîáðàæåíèÿ îïðåäåëÿåò, êàêîìó ó÷àñòêó èçîáðàæåíèÿ êàêîé URL-àäðåñ ñîîòâåòñòâóåò. Êàðòà èçîáðàæåíèÿ ìîæåò íàõîäèòüñÿ â òîì æå äîêóìåíòå, ÷òî è èçîáðàæåíèå, èëè â äðóãîì äîêóìåíòå. Ðàçìåùåíèå êàðòû â äðóãîì äîêóìåíòå ïîçâîëÿåò îáúåäèíÿòü âìåñòå èçîáðàæåíèÿ èç ðàçíûõ äîêóìåíòîâ, íî äîáàâëÿåò åùå îäíó èòåðàöèþ â ìåõàíèçì ôóíêöèîíèðîâàíèÿ êàðòû, ïîñêîëüêó çà ïåðâóþ èòåðàöèþ âûÿñíÿåòñÿ ìåñòîíàõîæäåíèå êàðòû, à çà âòîðóþ — âûïîëíåíèå äåéñòâèÿ, ïðåäïèñàííîãî URL-àäðåñîì äàííîãî ó÷àñòêà èçîáðàæåíèÿ. Ïàðàìåòð map_name óêàçûâàåò èìÿ êàðòû äëÿ èçîáðàæåíèÿ, à ïðåäøåñòâóþùèé åìó URL-àäðåñ — ìåñòîíàõîæäåíèå êàðòû. Åñëè ïàðàìåòð URL îòñóòñòâóåò, êàðòà ñ óêàçàííûì èìåíåì èùåòñÿ â òåêóùåì äîêóìåíòå. Ïðèìåð ñèíòàêñèñà îïðåäåëåíèÿ êàðòû èçîáðàæåíèÿ: <MAP NAME="map_name"> .

Àòðèáóò NAME çàäàåò èìÿ êàðòû, íàïðèìåð: NAME="ÊÀÐÒÀ" — èìÿ êàðòû.

Òåã Òåã îïðåäåëÿåò àêòèâíóþ îáëàñòü â ñîñòàâå êàðòû èçîáðàæåíèé íà ñòîðîíå êëèåíòà (ýòî îïèñàòåëü àêòèâíîé îáëàñòè). Òåã íå èìååò çàêðûâàþùåãî òåãà. Ñèíòàêñèñ: <MAP name="èìÿ">

Äëÿ êàæäîé àêòèâíîé îáëàñòè êàðòû èìååòñÿ ñâîé òåã . m Àòðèáóò SHAPE. Àòðèáóò SHAPE çàäàåò ôîðìó àêòèâíîé îáëàñòè íà êàðòå è åå êîîðäèíàòû, îí ìîæåò ïðèíèìàòü çíà÷åíèÿ: q rect — ïðÿìîóãîëüíàÿ îáëàñòü;

Óðîê 3. Ãðàôèêà

q circle — îáëàñòü â ôîðìå êðóãà; q poly — îáëàñòü â ôîðìå ìíîãîóãîëüíèêà; q default — âñÿ îáëàñòü. Àòðèáóòû, îïðåäåëÿþùèå ôîðìó îáëàñòè íà êàðòå, ÿâëÿþòñÿ îáÿçàòåëüíûìè. m Àòðèáóò COORDS. Àòðèáóò COORDS îïðåäåëÿåò ïîçèöèþ îáëàñòè íà ýêðàíå. Ñèíòàêñèñ: COORDS="êîîðäèíàòû"

Íàáîð êîîðäèíàò ñîîòâåòñòâóåò ôîðìå îáëàñòè. Êîîðäèíàòû çàäàþòñÿ â åäèíèöàõ äëèíû è ðàçäåëÿþòñÿ çàïÿòûìè: q äëÿ êðóãà íåîáõîäèìî çàäàòü êîîðäèíàòû öåíòðà è ðàäèóñ â ïèêñåëàõ (êîîðäèíàòû öåíòðà îòñ÷èòûâàþòñÿ îò ëåâîãî êðàÿ è âåðõíåãî êðàÿ ðèñóíêà); q äëÿ ïðÿìîóãîëüíîé îáëàñòè çàäàþòñÿ êîîðäèíàòû âñåõ ÷åòûðåõ óãëîâ; q äëÿ ìíîãîóãîëüíîé îáëàñòè çàäàþòñÿ êîîðäèíàòû êàæäîãî èç óãëîâ ìíîãîóãîëüíèêà, êîòîðûé òî÷íî èëè ïðèáëèçèòåëüíî ñîîòâåòñòâóåò ôîðìå îáëàñòè. m Àòðèáóò HREF. Àòðèáóò HREF çàäàåò URL-àäðåñ äëÿ ññûëêè. Ñèíòàêñèñ:

m Àòðèáóò ALT. Àòðèáóò ALT çàäàåò àëüòåðíàòèâíûé òåêñò äëÿ áðàóçåðîâ, êîòîðûå íå ïîääåðæèâàþò òåã . Ñèíòàêñèñ:

m Àòðèáóò TITLE. Àòðèáóò TITLE çàäàåò òåêñò ïîäñêàçêè, âñïëûâàþùåé ïðè íàâåäåíèè óêàçàòåëÿ ìûøè íà àêòèâíóþ îáëàñòü. Ñèíòàêñèñ:

m Àòðèáóò TARGET. Àòðèáóò TARGET èäåíòèôèöèðóåò ôðåéì, â êîòîðîì äîëæåí áûòü îòêðûò öåëåâîé ðåñóðñ. Ñèíòàêñèñ: TARGET="èìÿ|_blank|_self|_parent|_top"

Ïàðàìåòðû: q èìÿ — äîêóìåíò îòêðûâàåòñÿ âî ôðåéìå ñ èìåíåì, çàäàâàåìûì ñ ïîìîùüþ àòðèáóòà NAME äåñêðèïòîðà (èìÿ ôðåéìà äîëæíî íà÷èíàòüñÿ ñ áóêâû); q _blank — äîêóìåíò îòêðûâàåòñÿ â íîâîì íåèìåíîâàííîì îêíå; q _self — äîêóìåíò îòêðûâàåòñÿ â òîì æå îêíå, â êîòîðîì ñîäåðæèòñÿ òåêóùèé äîêóìåíò; q _parent — äîêóìåíò îòêðûâàåòñÿ âî ôðåéìå, ðîäèòåëüñêîì ïî îòíîøåíèþ ê ôðåéìó, ñîäåðæàùåìó òåêóùèé äîêóìåíò (åñëè ðîäèòåëüñêîãî ôðåéìà íå ñóùåñòâóåò, äîêóìåíò îòêðûâàåòñÿ â òåêóùåì ôðåéìå); q _top — äîêóìåíò îòêðûâàåòñÿ â òåêóùåì îêíå è çàíèìàåò âñå îêíî. m Àòðèáóò NOHREF. Àòðèáóò NOHREF óêàçûâàåò íà òî, ÷òî ñ îáëàñòüþ íå ñâÿçàíà ññûëêà. m Àòðèáóò TABINDEX. Àòðèáóò TABINDEX îïðåäåëÿåò ïîðÿäîê, â êîòîðîì àêòèâíûå îáëàñòè ïîëó÷àþò ôîêóñ ïîñëå íàæàòèÿ êëàâèøè Tab. Ñèíòàêñèñ: TABINDEX="÷èñëî"

Êàðòû èçîáðàæåíèé

m Àòðèáóò ACCESSKEY. Àòðèáóò ACCESSKEY îïðåäåëÿåò êîìáèíàöèþ êëàâèø, èñïîëüçóåìóþ äëÿ äîñòóïà ê àêòèâíîé îáëàñòè (ïåðåõîäà ïî URL). Ñèíòàêñèñ: ACCESSKEY="ñèìâîë"

m Àòðèáóò ONFOCUS. Àòðèáóò ONFOCUS îïðåäåëÿåò îáðàáîò÷èê ñîáûòèÿ, âîçíèêàþùåãî ïðè ïîëó÷åíèè àêòèâíîé îáëàñòüþ ôîêóñà ââîäà (ôîêóñ ââîäà ìîæåò áûòü ïîëó÷åí êàê ñ ïîìîùüþ ìûøè, òàê è â ðåçóëüòàòå ïåðåáîðà ïîñëå íàæàòèÿ êëàâèøè Tab). Ñèíòàêñèñ: ONFOCUS="ñöåíàðèé"

m Àòðèáóò ONBLUR. Àòðèáóò ONBLUR îïðåäåëÿåò îáðàáîò÷èê ñîáûòèÿ, âîçíèêàþùåãî ïðè ïîòåðå àêòèâíîé îáëàñòüþ ôîêóñà ââîäà (ôîêóñ ââîäà ìîæåò áûòü ïîòåðÿí êàê â ðåçóëüòàòå âûáîðà äðóãîãî ýëåìåíòà ñ ïîìîùüþ ìûøè, òàê è â ðåçóëüòàòå ïåðåáîðà ïîñëå íàæàòèÿ êëàâèøè Tab). Ñèíòàêñèñ: ONBLUR="ñöåíàðèé"

m Àòðèáóò USEMAP. Íåîáÿçàòåëüíûé àòðèáóò USEMAP ñâÿçûâàåò ñ äàííûì ýëåìåíòîì êàðòó èçîáðàæåíèÿ. Ñèíòàêñèñ: USEMAP="URL"

Ýòîò àòðèáóò ðàçðåøàåò èñïîëüçîâàòü èçîáðàæåíèÿ, îòäåëüíûå ÷àñòè êîòîðîãî ñâÿçàíû ñ êàðòàìè è îáúåäèíÿþòñÿ òåãîì <MAP>. Â ýòîì ñëó÷àå ùåë÷îê íà êàðòå îáðàáàòûâàåò áðàóçåð:

m Àòðèáóò ISMAP. Íåîáÿçàòåëüíûé àòðèáóò ISMAP èñïîëüçóåòñÿ äëÿ îïðåäåëåíèÿ êàðòû èçîáðàæåíèÿ íà ñòîðîíå ñåðâåðà. Ñèíòàêñèñ: ISMAP="äëèíà"

Òåã äîëæåí áûòü âêëþ÷åí â òåã . Àòðèáóò ISMAP ñîîáùàåò áðàóçåðó, ÷òî äàííîå èçîáðàæåíèå äàåò ïîëüçîâàòåëþ âîçìîæíîñòü âûïîëíÿòü êàêèåëèáî äåéñòâèÿ, ùåëêàÿ ìûøüþ íà àêòèâíûõ îáëàñòÿõ. Ýòîò àòðèáóò ðàçðåøàåò èñïîëüçîâàòü èçîáðàæåíèÿ, îòäåëüíûå ÷àñòè êîòîðîãî ñâÿçàíû ñî ññûëêàìè è ïîçâîëÿþò âûïîëíÿòü ïåðåõîäû. Òàêèå èçîáðàæåíèÿ ïðèìåíÿþòñÿ ñîâìåñòíî ñ òåãîì . Â ýòîì ñëó÷àå ðåàêöèþ íà ùåë÷îê îòðàáàòûâàåò ñåðâåð:

Ïðèìåðû êàðò èçîáðàæåíèé Â êà÷åñòâå ïðèìåðà êàðòû èçîáðàæåíèÿ ðàññìîòðèì ñåìåéíóþ ôîòîãðàôèþ. Ïðè íàâåäåíèè óêàçàòåëÿ ìûøè íà êàæäîãî ÷ëåíà ñåìüè ïîÿâëÿåòñÿ ñîîòâåòñòâóþùàÿ âñïëûâàþùàÿ ïîäñêàçêà è âîçìîæåí ïåðåõîä íà äðóãóþ âåá-ñòðàíèöó ñ áîëåå ïîäðîáíûìè äàííûìè î íåì. Êîä êàðòû ïðåäñòàâëåí â ëèñòèíãå 3.6, à íà ðèñ. 3.6 ïîêàçàíû âàðèàíòû êàðòû èçîáðàæåíèÿ ñ àêòèâíûìè îáëàñòÿìè â âèäå êðóãà, ïðÿìîóãîëüíèêà è ìíîãîóãîëüíèêà. Ïîä èçîáðàæåíèåì íàõîäèòñÿ ïîëå, â êîòîðîì ïîÿâëÿåòñÿ íàçâàíèå îáëàñòè ïðè íàâåäåíèè íà íåå óêàçàòåëÿ ìûøè. Èçîáðàæåíèå, êîòîðîå âûáðàíî äëÿ ïðèìåðà, èìååò ðàçìåð 400´300 ïèêñåëîâ.

Óðîê 3. Ãðàôèêà

Ðèñ. 3.6. Ïðèìåð êàðòû èçîáðàæåíèÿ

Ëèñòèíã 3.6. Ïðèìåð ñîçäàíèÿ êàðòû èçîáðàæåíèÿ ñ àêòèâíûìè îáëàñòÿìè â âèäå êðóãà, ïðÿìîóãîëüíèêà, ìíîãîóãîëüíèêà <TITLE>Ôîòîãðàôèÿ-êàðòà <MAP NAME=Map>

Êàðòû èçîáðàæåíèé

SHAPE=CIRCLE COORDS=310,80,70 HREF="Mather.htm">

Â äàííîì ïðèìåðå èçîáðàæåíèå, ðàçìåùåííîå íà ñòðàíèöå ñ ïîìîùüþ òåãà , ñòàíîâèòñÿ êàðòîé ñ ïîìîùüþ àòðèáóòà USEMAP. Â ëèñòèíãå 3.7 ïðåäñòàâëåí êîä åùå îäíîãî ïðèìåðà êàðòû èçîáðàæåíèÿ, ïîçâîëÿþùåé ïðîñìîòðåòü áîëåå ïîäðîáíî ïðèãîðîäû Ñàíêò-Ïåòåðáóðã, âûáèðàÿ ÷àñòü áîëüøîé ôîòîãðàôèè. Ôîòîãðàôèÿ ðàçäåëåíà íà ÷åòûðå ïðÿìîóãîëüíèêà (ðèñ. 3.7).

Ðèñ. 3.7. Åùå îäèí ïðèìåð êàðòû èçîáðàæåíèÿ

Ëèñòèíã 3.7. Ïðèìåð ñîçäàíèÿ êàðòû èçîáðàæåíèÿ ñ àêòèâíûìè îáëàñòÿìè â âèäå ïðÿìîóãîëüíèêîâ <TITLE>Ìåíþ-êàðòà Ïðèãîðîäû Ñàíêò-Ïåòåðáóðãà

Âîçìîæíî
îáòåêàíèå òåêñòà
âîêðóã òàáëèöû

Óðîê 3. Ãðàôèêà

Ïåòðîäâîðåö Ëîìîíîñîâ Ïóøêèí Ïàâëîâñê
Ãðàôè÷åñêèå ññûëêè
<MAP NAME = “mymap”>

×òîáû ëó÷øå ïîíÿòü, êàê çàäàþòñÿ êîîðäèíàòû îáëàñòåé, ïðèâåäåí ðèñ. 3.8 ñ êîîðäèíàòàìè â ïèêñåëàõ äëÿ êàæäîé ïðÿìîóãîëüíîé îáëàñòè.

Ðèñ. 3.8. Ðàçìåòêà ïðÿìîóãîëüíûõ îáëàñòåé êàðòû

Ýòî èçîáðàæåíèå, ñîñòîÿùåå èç ÷åòûðåõ âèäîâ ïðèãîðîäîâ Ñàíêò-Ïåòåðáóðãà, èìååò ðàçìåðû 380´540 ïèêñåëîâ.

Ìàñøòàáèðîâàíèå èçîáðàæåíèé Íà ðèñ. 3.9 ïîêàçàíà âåá-ñòðàíèöà (ëèñòèíã 3.8), ñîäåðæàùàÿ òðè èçîáðàæåíèÿ ðàçíîãî ðàçìåðà, èñòî÷íèêîì êîòîðûõ ÿâëÿåòñÿ îäèí è òîò æå ôàéë. Ôàéë èìååò ðàçìåðû 154 ïèêñåëà â øèðèíó è 248 ïèêñåëîâ â âûñîòó. Ïåðâîå èçîáðàæåíèå

Ìàñøòàáèðîâàíèå èçîáðàæåíèé

óâåëè÷åíî â äâà ðàçà, âòîðîå èìååò ðåàëüíûé ðàçìåð, ðàçìåðû òðåòüåãî èçîáðàæåíèÿ óìåíüøåíû â äâà ðàçà.

Ðèñ. 3.9. Òðè èçîáðàæåíèÿ ðàçíîãî ðàçìåðà èç îäíîãî ôàéëà

Ëèñòèíã 3.8. Ïðèìåð ñîçäàíèÿ òðåõ èçîáðàæåíèé ðàçíîãî ðàçìåðà èç îäíîãî ôàéëà <TITLE>Ðàçìåðû ðèñóíêà

Èçîáðàæåíèÿ îòñòîÿò äðóã îò äðóãà íà ðàññòîÿíèå òðåõ íåðàçðûâíûõ ïðîáåëîâ (êîòîðûå çàäàþòñÿ ñèìâîëàìè ). Åñëè íåïðîäóìàííî çàäàòü øèðèíó è âûñîòó èçîáðàæåíèÿ, îíî èñêàçèòñÿ. Òàêîé ïðèìåð ïðèâåäåí íà ðèñ. 3.10 (ëèñòèíã 3.9). Ëèñòèíã 3.9. Ïðèìåð íåóäà÷íîãî ïîëó÷åíèÿ òðåõ èçîáðàæåíèé ðàçíîãî ðàçìåðà èç îäíîãî ôàéëà <TITLE>Èñêàæåííûå ðèñóíêè

Óðîê 3. Ãðàôèêà

Ðèñ. 3.10. Òðè èçîáðàæåíèÿ ðàçíîãî ðàçìåðà, ïîëó÷åííûå èç îäíîãî ôàéëà

Ñòàíäàðòíûå ñîâðåìåííûå ìîíèòîðû èìåþò ðàçðåøåíèå 1024 ïèêñåëà â øèðèíó è 768 ïèêñåëîâ â âûñîòó. Ïðè ðàçðàáîòêå èçîáðàæåíèé ñëåäóåò ó÷èòûâàòü, ÷òî îêíî ïðîñìîòðà áóäåò çàíèìàòü ëèøü ÷àñòü ýòîé îáëàñòè. Íà ðèñ. 3.11 ïîêàçàíû èçîáðàæåíèÿ â âèäå ïîëîñ ñ óêàçàíèåì èõ øèðèíû è âûñîòû â ïèêñåëàõ (ëèñòèíã 3.10). Ïåðâàÿ ïîëîñà èìååò ðàçìåðû 90 ïèêñåëîâ â âûñîòó è 980 â øèðèíó, âòîðàÿ — 80 ïèêñåëîâ â âûñîòó è 780 â øèðèíó, òðåòüÿ — 75 ïèêñåëîâ â âûñîòó è 600 â øèðèíó, ÷åòâåðòàÿ — 70 ïèêñåëîâ â âûñîòó è 500 â øèðèíó, ïÿòàÿ — 65 ïèêñåëîâ â âûñîòó è 400 â øèðèíó, øåñòàÿ — 60 ïèêñåëîâ â âûñîòó è 200 â øèðèíó, ñåäüìàÿ — 50 ïèêñåëîâ â âûñîòó è 100 â øèðèíó. Ëèñòèíã 3.10. Ïðèìåðû ñîçäàíèÿ èçîáðàæåíèé ñ óêàçàíèåì èõ ðàçìåðîâ â ïèêñåëàõ <TITLE>Ðàçìåðû ðèñóíêîâ â ïèêñåëàõ

Åñëè ðàçìåð èçîáðàæåíèÿ ïî øèðèíå ïðåâûøàåò 980 ïèêñåëîâ, îíî íå ìîæåò ïîëíîñòüþ ïîìåñòèòüñÿ íà ýêðàíå, è ïîÿâëÿåòñÿ ãîðèçîíòàëüíàÿ ïîëîñà ïðîêðóòêè. Åñëè ðàçìåð èçîáðàæåíèÿ ïî âûñîòå ïðåâûøàåò 570 ïèêñåëîâ, îíî íå ìîæåò ïîëíîñòüþ ïîìåñòèòüñÿ íà ýêðàíå, è ïîÿâëÿåòñÿ âåðòèêàëüíàÿ ïîëîñà ïðîêðóòêè. Äëÿ ìîíèòîðîâ, ðàçìåðû êîòîðûõ â ïèêñåëàõ îòëè÷àþòñÿ îò âåëè÷èíû

Ïîäâåäåì èòîãè

1024´768, ðàçìåðû ïîëíîñòüþ ðàçìåùàåìîãî íà ýêðàíå èçîáðàæåíèÿ áóäóò äðóãèå, íî ñóòü îñòàíåòñÿ òà æå.

Ðèñ. 3.11. Ïðèìåðû èçîáðàæåíèé ñ óêàçàíèåì èõ ðàçìåðîâ â ïèêñåëàõ

Ïîäâåäåì èòîãè Â ýòîì óðîêå ðàññìîòðåíû òåãè, ïîçâîëÿþùèå ðàçìåùàòü ãðàôèêó íà âåá-ñòðàíèöàõ. Ãëàâíûì èç íèõ ÿâëÿåòñÿ òåã ñ åãî àòðèáóòàìè SRC, ALT, LONGDESC, HEIGTH, WIDTH, ALIGN, BORDER, VSPACE, HSPACE. Ìåñòîïîëîæåíèåì èçîáðàæåíèÿ íà ñòðàíèöå óïðàâëÿåò àòðèáóò âûðàâíèâàíèÿ ALIGN, êîòîðûé ìîæåò ïðèíèìàòü çíà÷åíèÿ top, middle, bottom, left è right (ñâåðõó, ïîñåðåäèíå, ñíèçó, ñëåâà, ñïðàâà). Ðàññêàçàíî òàêæå î òåãå <MAP>, êîòîðûé ïðèìåíÿåòñÿ äëÿ ïðåäñòàâëåíèÿ ãðàôè÷åñêîãî èçîáðàæåíèÿ â âèäå êàðòû ñ àêòèâíûìè îáëàñòÿìè. Ïðåäñòàâëåíû ïðèìåðû êàðò. Ðàññìîòðåíû ôîðìàòû ãðàôè÷åñêèõ ôàéëîâ JPEG è GIF, êîòîðûå îáû÷íî èñïîëüçóþòñÿ â Èíòåðíåòå. Ðàññêàçàíî òàêæå î ôîðìàòàõ BMP, PCX è PNG. Äëÿ ëó÷øåãî ïîíèìàíèÿ ïðèðîäû èçîáðàæåíèé ðàñêðûòû òàêèå ïîíÿòèÿ, êàê «ïèêñåëû» è «ðàçðåøåíèå».

Óðîê 4 Ôîí âåá-ñòðàíèö Êàæäàÿ âåá-ñòðàíèöà èìååò ôîí, íà êîòîðîì ìîæíî ðàçìåùàòü òåêñò è ðèñóíêè. Â ýòîì óðîêå ðàññìîòðåíû îñîáåííîñòè ñîçäàíèÿ ôîíà âåá-ñòðàíèö. Ïðèâåäåíà òàáëèöà öâåòîâ, íàèáîëåå ÷àñòî èñïîëüçóþùèõñÿ â Èíòåðíåòå.

Ôîíîâûå ðèñóíêè

Ôîíîâûå ðèñóíêè Áîëüøèíñòâî áðàóçåðîâ ïîçâîëÿåò âêëþ÷àòü â äîêóìåíò ôîíîâûé ðèñóíîê, êîòîðûé áóäåò îòîáðàæàòüñÿ íà çàäíåì ïëàíå âñåãî äîêóìåíòà. Íåêîòîðûì ïîëüçîâàòåëÿì íðàâèòñÿ âèäåòü íà âåá-ñòðàíèöàõ ôîíîâóþ ãðàôèêó, äðóãèì — íåò. Íåíàâÿç÷èâûé ïîëóïðîçðà÷íûé ðèñóíîê (îáîè) îáû÷íî õîðîøî âûãëÿäèò â êà÷åñòâå ôîíà áîëüøèíñòâà äîêóìåíòîâ. Îïèñàíèå ôîíîâîãî ðèñóíêà âêëþ÷àåòñÿ â òåã è âûãëÿäèò ñëåäóþùèì îáðàçîì:

Íà ðèñ. 4.1 ïîêàçàíà ñòðàíèöà ñ ôîíîì, êîä êîòîðîé ïðåäñòàâëåí â ëèñòèíãå 4.1.

Ðèñ. 4.1. Âåá-ñòðàíèöà ñ ôîíîâûì ðèñóíêîì

Ðèñ. 4.2. Ðèñóíîê, âûáðàííûé â êà÷åñòâå ôîíà, è äèàëîãîâîå îêíî ñ ðàçìåðàìè ýòîãî ðèñóíêà

Â êà÷åñòâå ôîíà âûáðàí ðèñóíîê ñ ðàçìåðàìè 4,97´4,52 ñì. Íåñìîòðÿ íà íåáîëüøèå ðàçìåðû, ðèñóíîê ïîêðûâàåò âñþ ïëîùàäü ñòðàíèöû, ñëîâíî ìíîæåñòâî ïëèòîê êàôåëÿ. Íà ðèñ. 4.2 ñëåâà ïîêàçàí èñõîäíûé ðèñóíîê, à ñïðàâà — äèàëîãîâîå îêíî ñ ðàçìåðàìè ýòîãî ðèñóíêà, îòêðûòîå â ïðîãðàììå Adobe Photoshop.

Óðîê 4. Ôîí âåá-ñòðàíèö

Ëèñòèíã 4.1. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé ôîíîâûé ðèñóíîê <TITLE> Ãðàôè÷åñêèé ôîí

Çàäàíèå ñòàíäàðòíûõ öâåòîâ Ìíîãèå ñîçäàòåëè âåá-ñòðàíèö èñïîëüçóþò äëÿ ôîíà äîêóìåíòà, îáû÷íîãî òåêñòà è ññûëîê ïðåäîïðåäåëåííûå öâåòà. ×òîáû çàäàòü ýòè öâåòà, íåîáõîäèìî âêëþ÷èòü â òåã äîïîëíèòåëüíûå ïàðàìåòðû:

Çäåñü êàæäûé èç ïàðàìåòðîâ îïðåäåëÿåò öâåò òîãî èëè èíîãî ýëåìåíòà ñòðàíèöû: m BGCOLOR — öâåò ôîíà äîêóìåíòà; m TEXT — öâåò ïðîñòîãî òåêñòà äîêóìåíòà; m LINK — öâåò ññûëêè. Öâåò çàäàåòñÿ øåñòèçíà÷íûì ÷èñëîì â øåñòíàäöàòåðè÷íîì ôîðìàòå è öâåòîâîé ìîäåëè RGB. Çíà÷åíèå #000000 ñîîòâåòñòâóåò ÷åðíîìó öâåòó, çíà÷åíèå #FFFFFF — áåëîìó. Íàïðèìåð:

Äàííàÿ ñòðîêà îïðåäåëÿåò áåëûé öâåò ôîíà äîêóìåíòà, ÷åðíûé òåêñò è ñåðåáðèñòûå ññûëêè.

Ðèñ. 4.3. Âåá-ñòðàíèöà, ñîäåðæàùàÿ òåêñò áåëîãî öâåòà íà ñèíåì ôîíå

Íà ðèñ. 4.3 ïîêàçàíà âåá-ñòðàíèöà, ñîäåðæàùàÿ òåêñò áåëîãî öâåòà íà ñèíåì ôîíå (ëèñòèíã 4.2).

Çàäàíèå ñòàíäàðòíûõ öâåòîâ

Ëèñòèíã 4.2. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé òåêñò áåëîãî öâåòà íà ñèíåì ôîíå <TITLE>Öâåòîâîé ôîí Òåêñò áåëîãî öâåòà

Íà ðèñ. 4.4 ïîêàçàíà òà æå âåá-ñòðàíèöà, ÷òî è íà ðèñ. 4.3, íî ñ àòðèáóòàìè, êîòîðûå çàäàþò âåðõíþþ, íèæíþþ, ëåâóþ, ïðàâóþ ãðàíèöû ñòðàíèöû â ïèêñåëàõ (ëèñòèíã 4.3). Âèäíî, ÷òî òåêñò ñìåùåí îòíîñèòåëüíî ãðàíèö ñòðàíèöû.

Ðèñ. 4.4. Âåá-ñòðàíèöà, íà êîòîðîé òåêñò èìååò îòñòóïû

Ðèñ. 4.5. Ôðàãìåíò âåá-ñòðàíèöû, ñîäåðæàùåé òàáëèöó öâåòîâ

Óðîê 4. Ôîí âåá-ñòðàíèö

Ëèñòèíã 4.3. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, íà êîòîðîé òåêñò èìååò îòñòóïû <TITLE>Öâåòîâîé ôîí Òåêñò áåëîãî öâåòà

Íà ðèñ. 4.5 ïîêàçàíà ÷àñòü âåá-ñòðàíèöû ñ íàçâàíèÿìè öâåòîâ, êîòîðûå ìîãóò èñïîëüçîâàòüñÿ íà âåá-ñòðàíèöå â êà÷åñòâå ôîíîâûõ (ëèñòèíã 4.4). Òàêóþ òàáëèöó ðàçðàáîò÷èêàì âåá-ñòðàíèö ïîëåçíî èìåòü ïîä ðóêîé, ïîñêîëüêó ñ åå ïîìîùüþ î÷åíü óäîáíî ïîäáèðàòü öâåòà è îïðåäåëÿòü èõ çíà÷åíèÿ. Ëèñòèíã 4.4. Ïðèìåð ñîçäàíèÿ òàáëèöû öâåòîâ <TITLE>Òàáëèöà öâåòîâ Òàáëèöà öâåòîâ

Çàäàíèå ñòàíäàðòíûõ öâåòîâ

ïðîäîëæåíèå È

Óðîê 4. Ôîí âåá-ñòðàíèö

Ëèñòèíã 4.4 (ïðîäîëæåíèå)

Çàäàíèå ñòàíäàðòíûõ öâåòîâ

ïðîäîëæåíèå È

Óðîê 4. Ôîí âåá-ñòðàíèö

Ëèñòèíã 4.4 (ïðîäîëæåíèå)

Ïîäâåäåì èòîãè

ALICEBLUE-ÃÐßÇÍÎ ÃÎËÓÁÎÉ
(#F0F8FF) ANTIQUEWHITE-ÀÍÒÈ×ÍÛÉ ÁÅËÛÉ
(#FAEBD7) AQUA-ÀÊÂÀ
(#00FFFF) AQUAMARINE-ÀÊÂÀÌÀÐÈÍ-ÇÅËÅÍÎÂÀÒÎ-ÃÎËÓÁÎÉ
(#7FFFD4)
AZURE-ËÀÇÓÐÍÛÉ
(#F0FFFF) BEIGE-ÁÅÆÅÂÛÉ
(#F5F5DC) BISQUE-ÁÈÑÊÂÈÒ
(#FFE4C4) BLACK-×ÅÐÍÛÉ
(#000000)
BLANCHEDALMOND-ÁËÅÄÍÛÉ ÄÀËÜÌÎÍÄ
(#FFEBCD) BLUE-ÑÈÍÈÉ
(#0000FF) BLUEVIOLET-ÔÈÎËÅÒÎÂÛÉ
(#8A2BE2) BROWN-ÊÎÐÈ×ÍÅÂÛÉ
(#A52A2A)
BURLYWOOD-ÄÐÅÂÅÑÍÛÉ
(#DEB887) CADETBLUE-ÌÎÐÑÊÎÉ
(#5F9EA0) CHARTREUSE-ËÈÊÅÐ ØÀÐÒÐÅÇ
(#7FFF00) CHOCOLATE-ØÎÊÎËÀÄÍÛÉ
(#D2691E)
CORAL-ÊÎÐÀËË
(#FF7F50)

CORNFLOWER-ÊÓÊÓÐÓÇÍÛÉ ÖÂÅÒÎÊ
(#6495ED) CORNSILK-ÊÓÊÓÐÓÇÍÛÉ ØÅËÊ
(#FFF8DC) CRIMSON-ÌÀËÈÍÎÂÛÉ
(#DC143C)
CYAN-ÃÎËÓÁÎÉ
(#00FFFF) DARKBLUEÒÅÌÍÎ-ÑÈÍÈÉ
(#00008B) DARKCYANÒÅÌÍÎ-ÃÎËÓÁÎÉ
(#008B8B) DARKGOLDENRODÒÅÌÍÎ-ÇÎËÎÒÎÉ
(#B8860B)
DARKGRAYÒÅÌÍÎ-ÑÅÐÛÉ
(#A9A9A9) DARKGREENÒÅÌÍÎ-ÇÅËÅÍÛÉ
(#006400) DARKKHAKI- ÒÅÌÍÛÉ ÕÀÊÈ
(#BDB76B) DARKMAGENTAÒÅÌÍÎ-ÏÓÐÏÓÐÍÛÉ
(#8B008B)
DARKOLIVEGREENÒÅÌÍÎ-ÇÅËÅÍÎÎËÈÂÊÎÂÛÉ
(#556B2F) DARKORANGEÒÅÌÍÎ-ÎÐÀÍÆÅÂÛÉ
(#FF8C00) DARKORCHID- ÒÅÌÍÎÉ ÎÐÕÈÄÅÈ
(#9932CC) DARKREDÒÅÌÍÎ-ÊÐÀÑÍÛÉ
(#8B0000)
DARKSALMONÒÅÌÍÎ-ÎÐÀÍÆÅÂÎ ÐÎÇÎÂÛÉ
(#E9967A) DARKSEAGREENÒÅÌÍÎ-ÇÅËÅÍÛÉ ÌÎÐÑÊÎÉ
(#8FBC8B) DARKSLATEBLUEÒÅÌÍÎ-ÑÅÐÎÃÎËÓÁÎÉ
(#483D8B) DARKSLATEGRAYÒÅÌÍÎ-ÃÎËÓÁÎÑÅÐÛÉ
(#2F4F4F)
DARKTURQUOISEÒÅÌÍÎ-ÁÈÐÞÇÎÂÛÉ
(#00CED1) DARKVIOLETÒÅÌÍÎ-ÔÈÎËÅÒÎÂÛÉ
(#9400D3) DEEPPINK- ÍÀÑÛÙÅÍÍÎ ÐÎÇÎÂÛÉ
(#FF1493) DEEPSKYBLUE- ÍÀÑÛÙÅÍÍÎ ÍÅÁÅÑÍÛÉ
(#00BFFF)
DIMGRAY-ÒÓÑÊËÎ-ÑÅÐÛÉ
(#696969) DODGERBLUE- ÈÇÌÅÍÅÍÍÛÉ ÑÈÍÈÉ
(#1E90FF) FIREBRICK- ÎÃÍÅÍÍÎÊÈÐÏÈ×ÍÛÉ
(#B22222) FLORALWHITEÖÂÅÒÎ×ÍÎÁÅËÛÉ
(#FFFAF0)

FORESTGREEN- ËÅÑÍÎÉ ÇÅËÅÍÈ
(#228B22) FUCHIA-ÔÈÑÒÀØÊÎÂÛÉ
(#FF00FF) GAINSBORO-ÃÅÉÍÑÁÎÐÎ
(#DCDCDC) GHOSTWHITE-ÅËÅ ÇÀÌÅÒÍÛÉ ÁÅËÛÉ
(#F8F8FF)
GOLD-ÇÎËÎÒÎÉ
(#FFD700) GOLDENRODÒÅÌÍÎ-ÇÎËÎÒÎÉ
(#DAA520) GRAY-ÑÅÐÛÉ
(#808080) GREEN-ÇÅËÅÍÛÉ
(#008000)
GREENYELLOWÇÅËÅÍÎ-ÆÅËÒÛÉ
(#ADFF2F) HONEYDEW- ÌÅÄÂÅÍÎÉ ÐÎÑÛ
(#F0FFF0) HOTPINKÆÀÐÊÎ-ÐÎÇÎÂÛÉ
(#FF69B4) INDIANRED- ÊÐÀÑÍÛÉ ÈÍÄÈÃÎ
(#CD5C5C)
INDIGO-ÈÍÄÈÃÎ
(#4B0082) IVORY- ÑËÎÍÎÂÎÉ ÊÎÑÒÈ
(#FFFFF0) KHAKI-ÕÀÊÈ
(#F0E68C) LAVENDERËÀÂÀÍÄÎÂÛÉ
(#E6E6FA)
LAVENDERBLUSHÏÎÊÐÀÑÍÅÍÍÎÉ ËÀÂÀÍÄÛ
(#FFF0F5) LAWNGREEN- ÒÐÀÂßÍÎÉ ÇÅËÅÍÈ
(#7CFC00) LEMONCHIFFONËÈÌÎÍÍÎ-ÊÎÐÈ×ÍÅÂÛÉ
(#FFFACD) LIGHTBLUEÑÂÅÒËÎ-ÑÈÍÈÉ
(#ADD8E6)
LIGHTCORALÑÂÅÒËÎ-ÊÎÐÀËËÎÂÛÉ
(#F08080) LIGHTCYANÑÂÅÒËÎ-ÃÎËÓÁÎÉ
(#E0FFFF) LIGHTGOLDENRODYELLOW- ÑÂÅÒËÎÇÎËÎÒÎÉ
(#FAFAD2) LIGHTGREENÑÂÅÒËÎ-ÇÅËÅÍÛÉ
(#90EE90)
LIGHTGREYÑÂÅÒËÎ-ÑÅÐÛÉ
(#D3D3D3) LIGHTPINKÑÂÅÒËÎ-ÐÎÇÎÂÛÉ
(#FFB6C1)

LIGHTSALMONÑÂÅÒËÎ-ÎÐÀÍÆÅÂÎ-ÐÎÇÎÂÛÉ
(#FFA07A) LIGHTSEAGREEN- ÑÂÅÒËÎÉ ÌÎÐÑÊÎÉ ÂÎËÍÛ
(#20B2AA)
LIGHTSKYBLUEÑÂÅÒËÎ-ÍÅÁÅÑÍÎ-ÑÈÍÈÉ
(#87CEFA) LIGHTSLATEGRAYÑÂÅÒËÎ-ÃÎËÓÁÎÑÅÐÛÉ
(#778899) LIGHTSTEELBLUE- ÑÂÅÒËÛÉ ÑÅÐÎ-ÑÈÍÈÉ
(#B0C4DE) LIGHTYELLOWÑÂÅÒËÎ-ÆÅËÒÛÉ
(#FFFFE0)
LIME-ËÈÏÎÂÛÉ ÖÂÅÒ
(#00FF00) LIMEGREENËÈÏÎÂÎ-ÇÅËÅÍÛÉ
(#32CD32) LINEN-ËÜÍßÍÎÉ
(#FAF0E6) MAGENTAÏÓÐÏÓÐÍÛÉ
(#FF00FF)
MAROONÊÀØÒÀÍÎÂÛÉ
(#800000) MEDIUMAQUAMARINEÓÌÅÐÅÍÍÛÉ ÀÊÂÀÌÀÐÈÍ
(#66CDAA) MEDIUMBLUE- ÓÌÅÐÅÍÍÛÉ ÑÈÍÈÉ
(#0000CD) MEDIUMORCHID- ÓÌÅÐÅÍÍÎÉ ÀÐÕÈÄÅÈ
(#BA55D3)
MEDIUMPURPLEÓÌÅÐÅÍÍÎ-ÏÓÐÏÓÐÍÛÉ
(#9370DB) MEDIUMSEAGREENÓÌÅÐÅÍÍÎ-ÌÎÐÑÊÎÉ
(#3CB371) MEDIUMSLATEBLUE
(#7B68EE) MEDIUMSPRINGGREENÓÌÅÐÅÍÍÎ-ÑÅÐÎÑÈÍÈÉ
(#00FA9A)
MEDIUMTURQUOISEÓÌÅÐÅÍÍÎ-ÁÈÐÞÇÎÂÛÉ
(#48D1CC) MEDIUMVIOLETREDÓÌÅÐÅÍÍÎ-ÔÈÎËÅÒÎÂÎ-ÊÐÀÑÍÛÉ
(#C71585) MIDNIGHTBLUE- ÑÐÅÄÍÈÉ ÒÅÌÍÎ-ÑÈÍÈÉ
(#191970) MINTCREAMÊÐÅÌÎÂÛÉ
(#F5FFFA)
MISTYROSE- ÊÐÀÑÍÛÉ ÒÓÌÀÍ
(#FFE4E1) MOCCASIN- ÖÂÅÒ ÎÁÓÂÈ ÈÍÄÅÉÖÅÂ
(#FFE4B5) NAVAJOWHITEÑÂÅÒËÎ-ÊÎÐÈ×ÍÅÂÛÉ
(#FFDEAD) NAVY-ÌÎÐÑÊÎÉ
(#000080)
OLDLACE- ÑÒÀÐÛÅ ÊÐÓÆÅÂÀ
(#FDF5E6)

OLIVEÎËÈÂÊÎÂÛÉ
(#808000) OLIVEDRAB- ÑÅÐÛÅ ÎËÈÂÊÈ
(#6B8E23) ORANGEÎÐÀÍÆÅÂÛÉ
(#FFA500)
ORANGEREDÎÐÀÍÆÅÂÎ-ÊÐÀÑÍÛÉ
(#FF4500) ORCHIDÎÐÕÈÄÅÈ
(#DA70D6) PALEGOLDENRODÁËÅÄÍÎ-ÇÎËÎÒÎÉ
(#EEE8AA) PALEGREENÁËÅÄÍÎ-ÇÅËÅÍÛÉ
(#98FB98)
PALETURQUOISEÁËÅÄÍÎ-ÁÈÐÞÇÎÂÛÉ
(#AFEEEE) PALEVIOLETRED- ÁËÅÄÍÎÔÈÎËÅÒÎÂÎ-ÊÐÀÑÍÛÉ
(#DB7093) PAPAYAWHIP- ÄÛÍÍÀß ÏËÅÒÜ
(#FFEFD5) PEACHPUFF- ÏÅÐÑÈÊÎÂÛÉ ÄÛÌ
(#FFDAB9)
PERU- ÖÂÅÒ ÏÓÑÒÛÍÈ
(#CD853F) PINK- ÐÎÇÎÂÛÉ
(#FFC0CB) PLUMÑËÈÂÎÂÛÉ
(#DDA0DD) POWDERBLUE- ÏÎÐÎØÊÎÂÎÑÈÍÈÉ
(#B0E0E6)
PURPLEÏÓÐÏÓÐÍÛÉ
(#800080) RED- ÊÐÀÑÍÛÉ
(#FF0000) ROSYBROWN- ÐÎÇÎÂÎÊÎÐÈ×ÍÅÂÛÉ
(#BC8F8F) ROYALBLUE- ÊÎÐÎËÅÂÑÊÎÑÈÍÈÉ
(#4169E1)
SADDLEBROWNÊÎÐÈ×ÍÅÂÎÅ ÑÅÄËÎ
(#8B4513) SALMON- ÖÂÅÒ ËÎÑÎÑß
(#FA8072) SANDYBROWN- ÐÛÆÅÂÀÒÎÊÎÐÈ×ÍÅÂÛÉ
(#F4A460) SEAGREEN- ÌÎÐÑÊÎÉ ÇÅËÅÍÈ
(#2E8B57)
SEASHELL- ÌÎÐÑÊÈÕ ÐÀÊÎÂÈÍ
(#FFF5EE) SIENNAÎÕÐÀ
(#A0522D) SILVERÑÅÐÅÁÐßÍÛÉ
(#C0C0C0)

SKYBLUE- ÑÈÍÅÃÎ ÍÅÁÀ
(#87CEEB)
SLATEBLUEÑËÀÍÖÅÂÎ-ÑÈÍÈÉ
(#6A5ACD) SLATEGRAYÑËÀÍÖÅÂÎ-ÑÅÐÛÉ
(#708090) SNOW- ÑÍÅÃ
(#FFFAFA) SPRINGGREEN- ÂÅÑÅÍÍßß ÇÅËÅÍÜ
(#00FF7F)
STEELBLUE-ÑÈÍÅÂÀÒÎÑÒÀËÜÍÎÉ
(#4682B4) TAN-ÊÎÐÀ ÄÓÁÀ
(#D2B48C) TEAL-×ÈÐÎÊ
(#008080) THISTLE-×ÅÐÒÎÏÎËÎÕ
(#D8BFD8)
TOMATO-ÒÎÌÀÒÍÛÉ
(#FF6347) TURQUOISE-ÁÈÐÞÇÀ
(#40E0D0) VIOLET-ÔÈÎËÅÒÎÂÛÉ
(#EE82EE) WHEAT-ÏØÅÍÈÖÀ
(#F5DEB3)
WHITE-ÁÅËÛÉ
(#FFFFFF) WHITESMOKE-ÄÛÌ
(#F5F5F5) YELLOW-ÆÅËÒÛÉ
(#FFFF00) YELLOWGREENÆÅËÒÎ-ÇÅËÅÍÛÉ
(#9ACD32)
&NBSP;

Ïîäâåäåì èòîãè Â ýòîì óðîêå ðàññêàçàíî, êàê ñîçäàòü ôîí âåá-ñòðàíèöû. Â êà÷åñòâå ôîíà ìîæíî èñïîëüçîâàòü ðèñóíîê èëè ñäåëàòü ôîí îäíîòîííûì. Â êîíöå óðîêà ïðèâåäåí ëèñòèíã î÷åíü ïîëåçíîé äëÿ ðàçðàáîò÷èêîâ âåá-ñòðàíèö ïðîãðàììû, îïèñûâàþùåé 140 ðàçëè÷íûõ öâåòîâ ñ óêàçàíèåì èõ îðèãèíàëüíûõ íàçâàíèé è øåñòíàäöàòåðè÷íûõ êîäîâ â öâåòîâîé ìîäåëè RGB.

Óðîê 5 Ëèíèè, òî÷êè è äðóãèå îáúåêòû Â ýòîì óðîêå ðàññìàòðèâàþòñÿ ñïîñîáû ñîçäàíèÿ ëèíèé, êîòîðûå ìîãóò ñòàòü óêðàøåíèåì ñòðàíèö, à òàêæå ñïîñîáû âñòàâêè íà âåá-ñòðàíèöû êàâû÷åê, çíàêîâ ñðàâíåíèÿ è ïðî÷åãî, òî åñòü ñïåöèàëüíûõ ñèìâîëîâ. Êðîìå òîãî, â êîíöå óðîêà îïèñûâàþòñÿ ñðåäñòâà ðàçìåùåíèÿ íà âåá-ñòðàíèöàõ áîëåå ñëîæíûõ îáúåêòîâ, òàêèõ êàê Java-àïïëåòû, ñöåíàðèè è ïðî÷åå.

Ãîðèçîíòàëüíûå ëèíèè

Ãîðèçîíòàëüíûå ëèíèè Äëÿ âñòàâêè ãîðèçîíòàëüíîé ëèíèè èñïîëüçóåòñÿ òåã
. Ýòî îäèíàðíûé òåã, çàêðûâàþùåãî òåãà îí íå èìååò. Ïî óìîë÷àíèþ ëèíèÿ ÿâëÿåòñÿ îáúåìíîé è ñ òåíüþ. Ãîðèçîíòàëüíûå ëèíèè ïîçâîëÿþò ðàçäåëèòü äëèííûé ôîðìàëüíî íåîãðàíè÷åííûé òåêñò íà îòäåëüíûå ðàçäåëû. Ãîðèçîíòàëüíûå ëèíèè íà âåá-ñòðàíèöàõ èãðàþò òàêóþ æå ðîëü, êàê îðíàìåíòàëüíûå ïîëîñû â ïå÷àòíûõ èçäàíèÿõ. Ñèíòàêñèñ:

Àòðèáóòû: m SIZE — òîëùèíà ëèíèè â ïèêñåëàõ; m WIDTH — øèðèíà ëèíèè â ïèêñåëàõ èëè ïðîöåíòàõ îò øèðèíû îêíà áðàóçåðà; m ALIGN — ïîëîæåíèå íà ýêðàíå (ñëåâà, ïî öåíòðó, ñïðàâà); m NOSHADE — ëèíèÿ ïðåäñòàâëÿåòñÿ ïðîñòîé îäíîòîííîé òåìíîé ïîëîñîé. Ïðèìåðû ãîðèçîíòàëüíûõ ëèíèé ðàçëè÷íîé òîëùèíû ïîêàçàíû íà ðèñ. 5.1 (ëèñòèíã 5.1).

Ðèñ. 5.1. Ãîðèçîíòàëüíûå ëèíèè ðàçëè÷íîé òîëùèíû

Óðîê 5. Ëèíèè, òî÷êè è äðóãèå îáúåêòû

Ëèñòèíã 5.1. Ïðèìåðû ñîçäàíèÿ ãîðèçîíòàëüíûõ ëèíèé ðàçëè÷íîé òîëùèíû <TITLE>Êðàñèâûå òîëñòûå è òîíêèå ëèíèè Êðàñèâûå òîëñòûå è òîíêèå ëèíèè

HORIZONTAL RULE - ãîðèçîíòàëüíàÿ ÷åðòà - îäèíàðíûé òåã. ÇÍÀ×ÅÍÈÅ SIZE = È WIDTH =
SIZE = 40 WIDTH = " 20 % "
SIZE = 30 WIDTH = " 30 % "
SIZE = 20 WIDTH = " 40 % "
SIZE = 10 WIDTH = " 50 % "
SIZE = 5 WIDTH = " 60 % "

Ïðèìåðû êîðîòêèõ ãîðèçîíòàëüíûõ ëèíèé ïîêàçàíû íà ðèñ. 5.2 (ëèñòèíã 5.2).

Ðèñ. 5.2. Êîðîòêèå ãîðèçîíòàëüíûå ëèíèè

Ëèñòèíã 5.2. Ïðèìåðû ñîçäàíèÿ êîðîòêèõ ãîðèçîíòàëüíûõ ëèíèé <TITLE>Êîðîòêèå ãîðèçîíòàëüíûå ëèíèè Ëèíèè â âèäå ôèãóð
_______________________________________________________
Äàííàÿ ëèíèÿ åñòü ñîâîêóïíîñòü ñèìâîëîâ ïîä÷åðêèâàíèÿ

Êëàâèàòóðíûå ñèìâîëû

Ïðèìåðû ãîðèçîíòàëüíûõ ëèíèé, âûðîâíåííûõ ïî ïðàâîìó êðàþ, ïîêàçàíû íà ðèñ. 5.3 (ëèñòèíã 5.3).

Ðèñ. 5.3. Ãîðèçîíòàëüíûå ëèíèè, âûðîâíåííûå ïî ïðàâîìó êðàþ ñòðàíèöû

Ëèñòèíã 5.3. Ïðèìåðû ñîçäàíèÿ ãîðèçîíòàëüíûõ ëèíèé, âûðîâíåííûõ ïî ïðàâîìó êðàþ ñòðàíèöû <TITLE>Ëèíèè, âûðîâíåííûå ïî ïðàâîìó êðàþ Ëèíèè, âûðîâíåííûå ïî ïðàâîìó êðàþ

Êëàâèàòóðíûå ñèìâîëû Êàê ïîêàçàíî íà ðèñ. 5.3, ñ ïîìîùüþ êëàâèàòóðû ìîæíî ðèñîâàòü ãîðèçîíòàëüíûå ëèíèè (êëàâèøà ïîä÷åðêèâàíèÿ _), à òàêæå íàêëîííûå âëåâî (\) è âïðàâî (/) ëèíèè, âåðòèêàëüíûå ëèíèè (|). Ñî÷åòàíèÿ òàêèõ ëèíèé ïîçâîëÿþò ïîëó÷àòü èíòåðåñíûå ðèñóíêè. Íà ðèñ. 5.4 ïîêàçàí ðèñóíîê ëèñòà, âûïîëíåííûé ñ ïîìîùüþ êëàâèàòóðíûõ ñèìâîëîâ (ëèñòèíã 5.4). Ëèñòèíã 5.4. Ïðèìåð ñîçäàíèÿ ëèñòà ñ ïîìîùüþ ñèìâîëîâ êëàâèàòóðû <TITLE>Ñèìâîëû, ââåäåííûå ñ êëàâèàòóðû

Óðîê 5. Ëèíèè, òî÷êè è äðóãèå îáúåêòû

Ëèñò,
íàðèñîâàííûé ñ ïîìîùüþ ñèìâîëîâ,
ââåäåííûõ ñ êëàâèàòóðû
^ /|\ \\|// \\\|/// \\\\|//// \\\|/// \\\\\\|////// \\\\\|///// \\\|/// |

Ðèñ. 5.4. Ëèñò, íàðèñîâàííûé ñ ïîìîùüþ ñèìâîëîâ êëàâèàòóðû Íà ðèñ. 5.5 ïîêàçàí ðèñóíîê ñîëíûøêà, âûïîëíåííûé ñ ïîìîùüþ êëàâèàòóðíûõ ñèìâîëîâ (ëèñòèíã 5.5). Ëèñòèíã 5.5. Ïðèìåð ðèñîâàíèÿ ñîëíûøêà ñ ïîìîùüþ ñèìâîëîâ êëàâèàòóðû <TITLE>Ñîëíûøêî, ïîñòðîåííîå ñ ïîìîùüþ ñèìâîëîâ êëàâèàòóðû Ñîëíûøêî, ïîñòðîåííîå ñ ïîìîùüþ ñèìâîëîâ, ââåäåííûõ ñ êëàâèàòóðû \|||/ \ ___ / __/ \__ __| |__ /\___/\ /|||\ Êëàâèàòóðíûå ñèìâîëû 91 Ðèñ. 5.5. Ñîëíûøêî, íàðèñîâàííîå ñ ïîìîùüþ ñèìâîëîâ êëàâèàòóðû Íà ðèñ. 5.6 ïîêàçàí ðèñóíîê ÷åëîâå÷êà, âûïîëíåííûé ñ ïîìîùüþ êëàâèàòóðû (ëèñòèíã 5.6). Ðèñ. 5.6. Ëèöî ÷åëîâåêà, íàðèñîâàííîå ñ ïîìîùüþ ñèìâîëîâ êëàâèàòóðû Ëèñòèíã 5.6. Ïðèìåð ðèñîâàíèÿ ëèöà ÷åëîâåêà ñ ïîìîùüþ ñèìâîëîâ êëàâèàòóðû <TITLE>×åëîâå÷åê oooooo o o o ! ! o o o o ==== o o o oooo 92 Óðîê 5. Ëèíèè, òî÷êè è äðóãèå îáúåêòû Êàê âû óæå óáåäèëèñü, ñ ïîìîùüþ êëàâèàòóðû ìîæíî ðèñîâàòü ñàìûå ðàçíûå çàáàâíûå ôèãóðû — äîïîëíèòåëüíûå ïðèìåðû èìåþòñÿ â ëèñòèíãàõ 5.7 è 5.8. Ëèñòèíã 5.7. Ïðèìåð ðèñîâàíèÿ çâåðÿ ñ ïîìîùüþ ñèìâîëîâ êëàâèàòóðû <TITLE>Çâåðü / / / / / / / / / /————-/ / { } ( * * ) { <> } { } <###> —— Ëèñòèíã 5.8. Ïðèìåð ðèñîâàíèÿ ïòèöû ñ ïîìîùüþ ñïåöèàëüíûõ ñèìâîëîâ <TITLE>Ïòèöà ? <<>> <<<<<<<<<<<<<< >>>>>>>>>>>>>>>>> <<<<<<<<< >>>>>>>>> <<<<<< >>>>>> <<<>>> <<>> >< Ñïåöèàëüíûå ñèìâîëû Íà ñòðàíèöå ìîãóò ðàçìåùàòüñÿ êàâû÷êè, çíàêè ñðàâíåíèÿ, çíàêè ïàðàãðàôà è äðóãèå ñïåöèàëüíûå ñèìâîëû. È äàæå «ïðåñëîâóòûé» ïðîáåë îòíîñèòñÿ ê ñïåöèàëüíûì ñèìâîëàì. Ïðèìåðû ïîêàçàíû íà ðèñ. 5.7 (ëèñòèíã 5.9). Ëèñòèíã 5.9. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû ñî ñïåöèàëüíûìè ñèìâîëàìè <TITLE>Ñïåö ñèìâîëû Àìïåðñàíò & Çíàê ìåíüøå < Çíàê áîëüøå > Çíàê òîðãîâîé ìàðêè ™ Íåðàçðûâíûé ïðîáåë Öåíò ¢ Ôóíò £ Ñïåöèàëüíûå ñèìâîëû 93 Çíàê âàëþòû ¤ Âåðòèêàëüíàÿ ÷åðòà ¦ Çíàê ïàðàãðàôà § Çíàê êîïèðàéòà © Ïðÿìàÿ êàâû÷êà " Ëåâàÿ òèïîãðàôñêàÿ êàâû÷êà « Ïðàâàÿ òèïîãðàôñêàÿ êàâû÷êà » Çíàê çàðåãèñòðèðîâàíî ® Çíàê ãðàäóñà ° Ñòåïåíü1 ¹ Ñòåïåíü2 ² Ñòåïåíü3 ³ Çíàê ìèêðî µ Çíàê àáçàöà ¶ Òî÷êà ìàðêåð · 1/4 ¼ 1/2 ½ Çíàê óìíîæåíèÿ × Çíàê äåëåíèÿ ÷ Ðèñ. 5.7. Âåá-ñòðàíèöà, ñîäåðæàùàÿ ñïåöèàëüíûå ñèìâîëû Ïðèìåðû îòêðûâàþùèõ è çàêðûâàþùèõ òåãîâ ïîêàçàíû íà ðèñ. 5.8 (ëèñòèíã 5.10). Çäåñü æå ïðåäñòàâëåíû íàäïèñè ðàçëè÷íîãî öâåòà. Ëèñòèíã 5.10. Ïðèìåð ñîçäàíèÿ âåá-ñòðàíèöû, ñîäåðæàùåé îòêðûâàþùèå è çàêðûâàþùèå òåãè <TITLE>Öâåò òåêñòà FONT SIZE=5 94 Óðîê 5. Ëèíèè, òî÷êè è äðóãèå îáúåêòû Ðèñ. 5.8. Âåá-ñòðàíèöà, ñîäåðæàùàÿ îòêðûâàþùèå è çàêðûâàþùèå òåãè Èíôîðìàöèÿ îá àâòîðå äîêóìåíòà Äëÿ âèçóàëüíîãî âûäåëåíèÿ èíôîðìàöèè îá àâòîðå äîêóìåíòà, íàïðèìåð åãî àäðåñà ýëåêòðîííîé ïî÷òû, ñëóæèò òåã . Ñèíòàêñèñ: Àäðåñ-àâòîðà Ýòîò òåã îáû÷íî óêàçûâàåòñÿ â êîíöå äîêóìåíòà. Ñîäåðæèìîå òåãà âûâîäèòñÿ, êàê ïðàâèëî, êóðñèâîì. Ïðèìåð äîêóìåíòà, ñîäåðæàùåãî àäðåñ, ïîêàçàí íà ðèñ. 5.9 (ëèñòèíã 5.11). Ëèñòèíã 5.11. Ïðèìåð ñîçäàíèÿ äîêóìåíòà, ñîäåðæàùåãî àäðåñ <TITLE>Àäðåñ HTML- Ó÷åáíûé êóðñ Êîìîëîâà Íèíà Âëàäèìèðîâíà Ñåâåðî=Çàïàäíûé èíñòèòóò ïå÷àòè Ñàíêò-Ïåòåðáóðãñêîãî ãîñóäàðñòâåííîãî óíèâåðñèòåòà òåõíîëîãèè è äèçàéíà [email protected] Ñöåíàðèè 95 Ðèñ. 5.9. Äîêóìåíò, ñîäåðæàùèé àäðåñ àâòîðà Java-àïïëåòû Äëÿ âñòàâêè â ñîñòàâ äîêóìåíòà Java-àïïëåòîâ ïðèìåíÿþò òåã <APPLET>. Java-àïïëåòû — ýòî ïðîãðàììû íà ÿçûêå Java, êîòîðûå çàãðóæàþòñÿ è âûïîëíÿþòñÿ áðàóçåðîì. Ïðîãðàììû, ïåðåäàííûå áðàóçåðó, ïðèäàþò ñòðàíèöå èíòåðàêòèâíîñòü, íå ñâîéñòâåííóþ ñòðàíèöàì, íàïèñàííûì áåç èñïîëüçîâàíèÿ àïïëåòîâ. Ïðîöåññ âñòàâêè Java-àïïëåòà ñîñòîèò èç äâóõ ýòàïîâ. Âî-ïåðâûõ, íåîáõîäèìî óáåäèòüñÿ, ÷òî âñå êëàññû è ñâÿçàííûå ôàéëû, òàêèå êàê ãðàôè÷åñêèå èçîáðàæåíèÿ è àóäèîôðàãìåíòû, ðàçìåùåíû â äîñòóïíîì êàòàëîãå — ÷àùå âñåãî ýòî ïîäêàòàëîã classes êàòàëîãà ñ HTML-äîêóìåíòàìè. Âî-âòîðûõ, â èñõîäíûé êîä ñòðàíèöû äîëæåí áûòü âíåäðåí òåã <APPLET>, à òàêæå âñå íåîáõîäèìûå äëÿ åãî ðàáîòû àòðèáóòû. Òåã <APPLET> èìååò àòðèáóòû CODEBASE, ARHIVE, CODE, OBJECT, ALT, NAME, WIDHT, HEIGHT, ALIGN, TOP, MIDDLE, BOTTOM, LEFT, RIGHT, HSPACE, VSPACE. Îí ïîÿâèëñÿ â HTML âåðñèè 3.2. Îáÿçàòåëüíûì ÿâëÿåòñÿ ëèáî àòðèáóò CODE, ëèáî CODEBASE. Òåã , âêëþ÷àåìûé â ñîñòàâ òåãà <APPLET>, äîëæåí ïðåäøåñòâîâàòü îñòàëüíîìó ñîäåðæèìîìó. Òåã <APPLET> íå ðåêîìåíäîâàí ê ïðèìåíåíèþ. Âìåñòî íåãî æåëàòåëüíî èñïîëüçîâàòü òåã

	à12		à14		à16
à21		à23		à25		à27

ÿ÷åéêà 11	ÿ÷åéêà 12	ÿ÷åéêà	ÿ÷åéêà 15
ÿ÷åéêà 21	ÿ÷åéêà 22	ÿ÷åéêà	ÿ÷åéêà 25
ÿ÷åéêà 31	ÿ÷åéêà 32	ÿ÷åéêà	ÿ÷åéêà 35
ÿ÷åéêà 41	ÿ÷åéêà 42	ÿ÷åéêà	ÿ÷åéêà 45
ÿ÷åéêà 51	ÿ÷åéêà 52	ÿ÷åéêà	ÿ÷åéêà 55
ÿ÷åéêà 61	ÿ÷åéêà 62	ÿ÷åéêà	ÿ÷åéêà 65
ÿ÷åéêà 71	ÿ÷åéêà 72	ÿ÷åéêà	ÿ÷åéêà 75
ÿ÷åéêà 81	ÿ÷åéêà 82	ÿ÷åéêà	ÿ÷åéêà 85

ÿ÷åéêà 11	ÿ÷åéêà 12	ÿ÷åéêà 15
ÿ÷åéêà 21	ÿ÷åéêà 22	ÿ÷åéêà 25
ÿ÷åéêà 31	ÿ÷åéêà 32	ÿ÷åéêà 35
ÿ÷åéêà 41	ÿ÷åéêà 42	ÿ÷åéêà 45
ÿ÷åéêà 51	ÿ÷åéêà 52	ÿ÷åéêà 55
ÿ÷åéêà 61	ÿ÷åéêà 62	ÿ÷åéêà 65
ÿ÷åéêà 71	ÿ÷åéêà 72	ÿ÷åéêà 75
ÿ÷åéêà 81	ÿ÷åéêà 82	ÿ÷åéêà 85

ÿ÷åéêà 11	ÿ÷åéêà 12	ÿ÷åéêà	ÿ÷åéêà 15
ÿ÷åéêà 21	ÿ÷åéêà 22	ÿ÷åéêà	ÿ÷åéêà 25
ÿ÷åéêà 31	ÿ÷åéêà 32	ÿ÷åéêà	ÿ÷åéêà 35
ÿ÷åéêà 41	ÿ÷åéêà 42	ÿ÷åéêà	ÿ÷åéêà 45
ÿ÷åéêà 51	ÿ÷åéêà 52	ÿ÷åéêà	ÿ÷åéêà 55
ÿ÷åéêà 61	ÿ÷åéêà 62	ÿ÷åéêà	ÿ÷åéêà 65
ÿ÷åéêà 71	ÿ÷åéêà 72	ÿ÷åéêà	ÿ÷åéêà 75
ÿ÷åéêà 81	ÿ÷åéêà 82	ÿ÷åéêà	ÿ÷åéêà 85

ÿ÷åéêà 11	ÿ÷åéêà	ÿ÷åéêà 15
ÿ÷åéêà 21	ÿ÷åéêà	ÿ÷åéêà 25
ÿ÷åéêà 31	ÿ÷åéêà	ÿ÷åéêà 35
ÿ÷åéêà 41	ÿ÷åéêà	ÿ÷åéêà 45
ÿ÷åéêà 51	ÿ÷åéêà	ÿ÷åéêà 55
ÿ÷åéêà 61	ÿ÷åéêà	ÿ÷åéêà 65
ÿ÷åéêà 71	ÿ÷åéêà	ÿ÷åéêà 75
ÿ÷åéêà 81	ÿ÷åéêà	ÿ÷åéêà 85

ALICEBLUE-ÃÐßÇÍÎ ÃÎËÓÁÎÉ (#F0F8FF)	ANTIQUEWHITE-ÀÍÒÈ×ÍÛÉ ÁÅËÛÉ (#FAEBD7)	AQUA-ÀÊÂÀ (#00FFFF)	AQUAMARINE-ÀÊÂÀÌÀÐÈÍ-ÇÅËÅÍÎÂÀÒÎ-ÃÎËÓÁÎÉ (#7FFFD4)
AZURE-ËÀÇÓÐÍÛÉ (#F0FFFF)	BEIGE-ÁÅÆÅÂÛÉ (#F5F5DC)	BISQUE-ÁÈÑÊÂÈÒ (#FFE4C4)	BLACK-×ÅÐÍÛÉ (#000000)
BLANCHEDALMOND-ÁËÅÄÍÛÉ ÄÀËÜÌÎÍÄ (#FFEBCD)	BLUE-ÑÈÍÈÉ (#0000FF)	BLUEVIOLET-ÔÈÎËÅÒÎÂÛÉ (#8A2BE2)	BROWN-ÊÎÐÈ×ÍÅÂÛÉ (#A52A2A)
BURLYWOOD-ÄÐÅÂÅÑÍÛÉ (#DEB887)	CADETBLUE-ÌÎÐÑÊÎÉ (#5F9EA0)	CHARTREUSE-ËÈÊÅÐ ØÀÐÒÐÅÇ (#7FFF00)	CHOCOLATE-ØÎÊÎËÀÄÍÛÉ (#D2691E)
CORAL-ÊÎÐÀËË (#FF7F50)	CORNFLOWER-ÊÓÊÓÐÓÇÍÛÉ ÖÂÅÒÎÊ (#6495ED)	CORNSILK-ÊÓÊÓÐÓÇÍÛÉ ØÅËÊ (#FFF8DC)	CRIMSON-ÌÀËÈÍÎÂÛÉ (#DC143C)
CYAN-ÃÎËÓÁÎÉ (#00FFFF)	DARKBLUEÒÅÌÍÎ-ÑÈÍÈÉ (#00008B)	DARKCYANÒÅÌÍÎ-ÃÎËÓÁÎÉ (#008B8B)	DARKGOLDENRODÒÅÌÍÎ-ÇÎËÎÒÎÉ (#B8860B)
DARKGRAYÒÅÌÍÎ-ÑÅÐÛÉ (#A9A9A9)	DARKGREENÒÅÌÍÎ-ÇÅËÅÍÛÉ (#006400)	DARKKHAKI- ÒÅÌÍÛÉ ÕÀÊÈ (#BDB76B)	DARKMAGENTAÒÅÌÍÎ-ÏÓÐÏÓÐÍÛÉ (#8B008B)
DARKOLIVEGREENÒÅÌÍÎ-ÇÅËÅÍÎÎËÈÂÊÎÂÛÉ (#556B2F)	DARKORANGEÒÅÌÍÎ-ÎÐÀÍÆÅÂÛÉ (#FF8C00)	DARKORCHID- ÒÅÌÍÎÉ ÎÐÕÈÄÅÈ (#9932CC)	DARKREDÒÅÌÍÎ-ÊÐÀÑÍÛÉ (#8B0000)
DARKSALMONÒÅÌÍÎ-ÎÐÀÍÆÅÂÎ ÐÎÇÎÂÛÉ (#E9967A)	DARKSEAGREENÒÅÌÍÎ-ÇÅËÅÍÛÉ ÌÎÐÑÊÎÉ (#8FBC8B)	DARKSLATEBLUEÒÅÌÍÎ-ÑÅÐÎÃÎËÓÁÎÉ (#483D8B)	DARKSLATEGRAYÒÅÌÍÎ-ÃÎËÓÁÎÑÅÐÛÉ (#2F4F4F)
DARKTURQUOISEÒÅÌÍÎ-ÁÈÐÞÇÎÂÛÉ (#00CED1)	DARKVIOLETÒÅÌÍÎ-ÔÈÎËÅÒÎÂÛÉ (#9400D3)	DEEPPINK- ÍÀÑÛÙÅÍÍÎ ÐÎÇÎÂÛÉ (#FF1493)	DEEPSKYBLUE- ÍÀÑÛÙÅÍÍÎ ÍÅÁÅÑÍÛÉ (#00BFFF)
DIMGRAY-ÒÓÑÊËÎ-ÑÅÐÛÉ (#696969)	DODGERBLUE- ÈÇÌÅÍÅÍÍÛÉ ÑÈÍÈÉ (#1E90FF)	FIREBRICK- ÎÃÍÅÍÍÎÊÈÐÏÈ×ÍÛÉ (#B22222)	FLORALWHITEÖÂÅÒÎ×ÍÎÁÅËÛÉ (#FFFAF0)
FORESTGREEN- ËÅÑÍÎÉ ÇÅËÅÍÈ (#228B22)	FUCHIA-ÔÈÑÒÀØÊÎÂÛÉ (#FF00FF)	GAINSBORO-ÃÅÉÍÑÁÎÐÎ (#DCDCDC)	GHOSTWHITE-ÅËÅ ÇÀÌÅÒÍÛÉ ÁÅËÛÉ (#F8F8FF)
GOLD-ÇÎËÎÒÎÉ (#FFD700)	GOLDENRODÒÅÌÍÎ-ÇÎËÎÒÎÉ (#DAA520)	GRAY-ÑÅÐÛÉ (#808080)	GREEN-ÇÅËÅÍÛÉ (#008000)
GREENYELLOWÇÅËÅÍÎ-ÆÅËÒÛÉ (#ADFF2F)	HONEYDEW- ÌÅÄÂÅÍÎÉ ÐÎÑÛ (#F0FFF0)	HOTPINKÆÀÐÊÎ-ÐÎÇÎÂÛÉ (#FF69B4)	INDIANRED- ÊÐÀÑÍÛÉ ÈÍÄÈÃÎ (#CD5C5C)
INDIGO-ÈÍÄÈÃÎ (#4B0082)	IVORY- ÑËÎÍÎÂÎÉ ÊÎÑÒÈ (#FFFFF0)	KHAKI-ÕÀÊÈ (#F0E68C)	LAVENDERËÀÂÀÍÄÎÂÛÉ (#E6E6FA)
LAVENDERBLUSHÏÎÊÐÀÑÍÅÍÍÎÉ ËÀÂÀÍÄÛ (#FFF0F5)	LAWNGREEN- ÒÐÀÂßÍÎÉ ÇÅËÅÍÈ (#7CFC00)	LEMONCHIFFONËÈÌÎÍÍÎ-ÊÎÐÈ×ÍÅÂÛÉ (#FFFACD)	LIGHTBLUEÑÂÅÒËÎ-ÑÈÍÈÉ (#ADD8E6)
LIGHTCORALÑÂÅÒËÎ-ÊÎÐÀËËÎÂÛÉ (#F08080)	LIGHTCYANÑÂÅÒËÎ-ÃÎËÓÁÎÉ (#E0FFFF)	LIGHTGOLDENRODYELLOW- ÑÂÅÒËÎÇÎËÎÒÎÉ (#FAFAD2)	LIGHTGREENÑÂÅÒËÎ-ÇÅËÅÍÛÉ (#90EE90)
LIGHTGREYÑÂÅÒËÎ-ÑÅÐÛÉ (#D3D3D3)	LIGHTPINKÑÂÅÒËÎ-ÐÎÇÎÂÛÉ (#FFB6C1)	LIGHTSALMONÑÂÅÒËÎ-ÎÐÀÍÆÅÂÎ-ÐÎÇÎÂÛÉ (#FFA07A)	LIGHTSEAGREEN- ÑÂÅÒËÎÉ ÌÎÐÑÊÎÉ ÂÎËÍÛ (#20B2AA)
LIGHTSKYBLUEÑÂÅÒËÎ-ÍÅÁÅÑÍÎ-ÑÈÍÈÉ (#87CEFA)	LIGHTSLATEGRAYÑÂÅÒËÎ-ÃÎËÓÁÎÑÅÐÛÉ (#778899)	LIGHTSTEELBLUE- ÑÂÅÒËÛÉ ÑÅÐÎ-ÑÈÍÈÉ (#B0C4DE)	LIGHTYELLOWÑÂÅÒËÎ-ÆÅËÒÛÉ (#FFFFE0)
LIME-ËÈÏÎÂÛÉ ÖÂÅÒ (#00FF00)	LIMEGREENËÈÏÎÂÎ-ÇÅËÅÍÛÉ (#32CD32)	LINEN-ËÜÍßÍÎÉ (#FAF0E6)	MAGENTAÏÓÐÏÓÐÍÛÉ (#FF00FF)
MAROONÊÀØÒÀÍÎÂÛÉ (#800000)	MEDIUMAQUAMARINEÓÌÅÐÅÍÍÛÉ ÀÊÂÀÌÀÐÈÍ (#66CDAA)	MEDIUMBLUE- ÓÌÅÐÅÍÍÛÉ ÑÈÍÈÉ (#0000CD)	MEDIUMORCHID- ÓÌÅÐÅÍÍÎÉ ÀÐÕÈÄÅÈ (#BA55D3)
MEDIUMPURPLEÓÌÅÐÅÍÍÎ-ÏÓÐÏÓÐÍÛÉ (#9370DB)	MEDIUMSEAGREENÓÌÅÐÅÍÍÎ-ÌÎÐÑÊÎÉ (#3CB371)	MEDIUMSLATEBLUE (#7B68EE)	MEDIUMSPRINGGREENÓÌÅÐÅÍÍÎ-ÑÅÐÎÑÈÍÈÉ (#00FA9A)
MEDIUMTURQUOISEÓÌÅÐÅÍÍÎ-ÁÈÐÞÇÎÂÛÉ (#48D1CC)	MEDIUMVIOLETREDÓÌÅÐÅÍÍÎ-ÔÈÎËÅÒÎÂÎ-ÊÐÀÑÍÛÉ (#C71585)	MIDNIGHTBLUE- ÑÐÅÄÍÈÉ ÒÅÌÍÎ-ÑÈÍÈÉ (#191970)	MINTCREAMÊÐÅÌÎÂÛÉ (#F5FFFA)
MISTYROSE- ÊÐÀÑÍÛÉ ÒÓÌÀÍ (#FFE4E1)	MOCCASIN- ÖÂÅÒ ÎÁÓÂÈ ÈÍÄÅÉÖÅÂ (#FFE4B5)	NAVAJOWHITEÑÂÅÒËÎ-ÊÎÐÈ×ÍÅÂÛÉ (#FFDEAD)	NAVY-ÌÎÐÑÊÎÉ (#000080)
OLDLACE- ÑÒÀÐÛÅ ÊÐÓÆÅÂÀ (#FDF5E6)	OLIVEÎËÈÂÊÎÂÛÉ (#808000)	OLIVEDRAB- ÑÅÐÛÅ ÎËÈÂÊÈ (#6B8E23)	ORANGEÎÐÀÍÆÅÂÛÉ (#FFA500)
ORANGEREDÎÐÀÍÆÅÂÎ-ÊÐÀÑÍÛÉ (#FF4500)	ORCHIDÎÐÕÈÄÅÈ (#DA70D6)	PALEGOLDENRODÁËÅÄÍÎ-ÇÎËÎÒÎÉ (#EEE8AA)	PALEGREENÁËÅÄÍÎ-ÇÅËÅÍÛÉ (#98FB98)
PALETURQUOISEÁËÅÄÍÎ-ÁÈÐÞÇÎÂÛÉ (#AFEEEE)	PALEVIOLETRED- ÁËÅÄÍÎÔÈÎËÅÒÎÂÎ-ÊÐÀÑÍÛÉ (#DB7093)	PAPAYAWHIP- ÄÛÍÍÀß ÏËÅÒÜ (#FFEFD5)	PEACHPUFF- ÏÅÐÑÈÊÎÂÛÉ ÄÛÌ (#FFDAB9)
PERU- ÖÂÅÒ ÏÓÑÒÛÍÈ (#CD853F)	PINK- ÐÎÇÎÂÛÉ (#FFC0CB)	PLUMÑËÈÂÎÂÛÉ (#DDA0DD)	POWDERBLUE- ÏÎÐÎØÊÎÂÎÑÈÍÈÉ (#B0E0E6)
PURPLEÏÓÐÏÓÐÍÛÉ (#800080)	RED- ÊÐÀÑÍÛÉ (#FF0000)	ROSYBROWN- ÐÎÇÎÂÎÊÎÐÈ×ÍÅÂÛÉ (#BC8F8F)	ROYALBLUE- ÊÎÐÎËÅÂÑÊÎÑÈÍÈÉ (#4169E1)
SADDLEBROWNÊÎÐÈ×ÍÅÂÎÅ ÑÅÄËÎ (#8B4513)	SALMON- ÖÂÅÒ ËÎÑÎÑß (#FA8072)	SANDYBROWN- ÐÛÆÅÂÀÒÎÊÎÐÈ×ÍÅÂÛÉ (#F4A460)	SEAGREEN- ÌÎÐÑÊÎÉ ÇÅËÅÍÈ (#2E8B57)
SEASHELL- ÌÎÐÑÊÈÕ ÐÀÊÎÂÈÍ (#FFF5EE)	SIENNAÎÕÐÀ (#A0522D)	SILVERÑÅÐÅÁÐßÍÛÉ (#C0C0C0)	SKYBLUE- ÑÈÍÅÃÎ ÍÅÁÀ (#87CEEB)
SLATEBLUEÑËÀÍÖÅÂÎ-ÑÈÍÈÉ (#6A5ACD)	SLATEGRAYÑËÀÍÖÅÂÎ-ÑÅÐÛÉ (#708090)	SNOW- ÑÍÅÃ (#FFFAFA)	SPRINGGREEN- ÂÅÑÅÍÍßß ÇÅËÅÍÜ (#00FF7F)
STEELBLUE-ÑÈÍÅÂÀÒÎÑÒÀËÜÍÎÉ (#4682B4)	TAN-ÊÎÐÀ ÄÓÁÀ (#D2B48C)	TEAL-×ÈÐÎÊ (#008080)	THISTLE-×ÅÐÒÎÏÎËÎÕ (#D8BFD8)
TOMATO-ÒÎÌÀÒÍÛÉ (#FF6347)	TURQUOISE-ÁÈÐÞÇÀ (#40E0D0)	VIOLET-ÔÈÎËÅÒÎÂÛÉ (#EE82EE)	WHEAT-ÏØÅÍÈÖÀ (#F5DEB3)
WHITE-ÁÅËÛÉ (#FFFFFF)	WHITESMOKE-ÄÛÌ (#F5F5F5)	YELLOW-ÆÅËÒÛÉ (#FFFF00)	YELLOWGREENÆÅËÒÎ-ÇÅËÅÍÛÉ (#9ACD32)

	2	3	4	5	6	7	8	9
2	4	6	8	10	12	14	16	18
3	6	9	12	15	18	21	24	27
4	8	12	16	20	24	28	32	36
5	10	15	16	25	30	35	40	45
6	12	18	24	30	36	42	48	54
7	14	21	28	35	42	49	56	63
8	16	24	32	40	48	56	64	72
9	18	27	36	45	54	63	72	81

êîä	öâåò
#B0E0E6	1
#AFEEEE	2
#7FFFD4	3 Ïðèìåðû òàáëèö
#00FA9A
#00FF00
#32CD32
#008000
#006400
#008080
#FF6800
#FF6000
#FF5800 137	4	5	6	7	8	9	10	11 TD BGCOLOR=#FF5800>12

Ýëåìåíò 11	Ýëåìåíò 12	Ýëåìåíò 13
Ýëåìåíò 21	Ýëåìåíò 22	Ýëåìåíò 23

Ýëåìåíò 31	Ýëåìåíò 32	Ýëåìåíò 33
Ýëåìåíò 41	Ýëåìåíò 42	Ýëåìåíò 43

Ýëåìåíò 51	Ýëåìåíò 52	Ýëåìåíò 53
Ýëåìåíò 61	Ýëåìåíò 62	Ýëåìåíò 63

Çíàê	Çíà÷åíèå	Êòî ââåë	Ãîä
=	ðàâåíñòâî	Ð.Ðåêîðä	1557
>, <	áîëüøå, ìåíüøå	Ò.Ãàððèîò	1631
¶	îòíîøåíèå äëèíû îêðóæíîñòè ê äèàìåòðó	Ó.Äæîíñîí	1706
×	óìíîæåíèå	Ó.Îóòðåä	1631
log	ëîãàðèôì	È.Êåïëåð	1624
sin	ñèíóñ	Á.Êàâàëüåðè	1632
cos	êîñèíóñ	Ë.Ýéëåð	1748

CYAN
MAGENTA
YELLOW
BLAÑK

CYAN
MAGENTA
YELLOW
BLAÑK

	2	3	4	5	6	7	8	9
2	4	6	8	10	12	14	16	18
3	6	9	12	15	18	21	24	27
4	8	12	16	20	24	28	32	36
5	10	15	16	25	30	35	40	45
6	12	18	24	30	36	42	48	54
7	14	21	28	35	42	49	56	63
8	16	24	32	40	48	56	64	72
9	18	27	36	45	54	63	72	81

À. Ñ. Ïóøêèí

Çèìíÿÿ äîðîãà

À. Ñ. Ïóøêèí

Çèìíåå óòðî

Çàãîëîâîê ïåðâîãî óðîâíÿ

Çàãîëîâîê 1 - Òðàíñïîðòíûé ïðîòîêîë

Çàãîëîâîê 2 - Ïðîòîêîë ìàðøðóòèçàöèè

Çàãîëîâîê 3 - Ïðîòîêîë ïåðåäà÷è ôàéëîâ

Çàãîëîâîê 4 - Ïðîòîêîë ïåðåäà÷è ïî÷òû

Çàãîëîâîê 5 - Ñåòåâîé ïðîòîêîë

Çàãîëîâîê 6 - Ïðîòîêîë ïîääåðæêè ñåòåâîãî àäðåñà

Îáòåêàíèå òåêñòîì îáúåêòîâ

Ïðèãîðîäû Ñàíêò-Ïåòåðáóðãà

Ãðàôè÷åñêèå ññûëêè

Òàáëèöà öâåòîâ

Êðàñèâûå òîëñòûå è òîíêèå ëèíèè

ÇÍÀ×ÅÍÈÅ SIZE = È WIDTH =

Ëèíèè â âèäå ôèãóð

Ëèíèè, âûðîâíåííûå ïî ïðàâîìó êðàþ

Ëèñò, íàðèñîâàííûé ñ ïîìîùüþ ñèìâîëîâ, ââåäåííûõ ñ êëàâèàòóðû

^ /|\ \\|// \\\|/// \\\\|//// \\\|/// \\\\\\|////// \\\\\|///// \\\|/// |

oooooo o o o ! ! o o o o ==== o o o oooo

/ / / / / / / / / /————-/ / { } ( * * ) { <> } { } <###> ——

Ïðîòîêîëû è ìîäåëè Èíòåðíåò-âçàèìîäåéñòâèÿ

Ñåâåðî-Çàïàäíûé èíñòèòóò ïå÷àòè

Ñàíêò-Ïåòåðáóðãñêèé ãîñóäàðñòâåííûé óíèâåðñèòåò òåõíîëîãèè è äèçàéíà

Òàáëèöà èç äâóõ ñòðîê è ñåìè ñòîëáöîâ

Òàáëèöà èç äâóõ ñòðîê è ñåìè ñòîëáöîâ

Öâåòîâàÿ ìîäåëü CMYK

Öâåòîâàÿ ìîäåëü CMYK

Ïðîñòàÿ òàáëèöà áåç ðàìêè

Ïðîñòàÿ òàáëèöà áåç ðàìêè

Ïðîñòàÿ òàáëèöà áåç ðàìêè

Ïðîñòàÿ òàáëèöà áåç ðàìêè

ÑÅÂÅÐÎ-ÇÀÏÀÄÍÛÉ ÈÍÑÒÈÒÓÒ ÏÅ×ÀÒÈ

ÍÀØ ÀÄÐÅÑ

ïåðåóëîê Äæàìáóëà, äîì 13

Ïðîñòàÿ òàáëèöà

<STRONG><EM>Ðàçëè÷íûå ñïîñîáû âûðàâíèâàíèÿ

Òàáëèöà ñ òðåìÿ ñòîëáöàìè è ÷åòûðüìÿ ñòðîêàìè

Òàáëèöà ñ ÷åòûðüìÿ ñòîëáöàìè è òðåìÿ ñòðîêàìè

Òàáëèöû ñ ðàçëè÷íûìè ðàìêàìè

Çàãîëîâîê, âûðîâíåííûé ïî öåíòðó

Òèïû áðàóçåðîâ

Ïåðâûé ãàôè÷åñêèé áðàóçåð ïîÿâèëñÿ â 1993 ãîäó

Ðîäèíà ìîÿ

Ñàíêò-Ïåòåðáóðã

Êàê ñäåëàòü êðàñèâî

Îñíîâíûå ïðàâèëà: Êîíòðàñò, Âûðàâíèâàíèå, Ïðèáëèæåííîñòü

Äàòû âîçíèêíîâåíèÿ ìàòåìàòè÷åñêèõ çíàêîâ

Ìîÿ ïåðâàÿ ôîðìà

ÊÀÊÀß ÔÎÐÌÀ ÂÛÃËßÄÈÒ ËÓ×ØÅ?

ÈËÈ

Óñòðîéñòâà ââîäà-âûâîäà êîìïüþòåðà

Ëèñò,
íàðèñîâàííûé ñ ïîìîùüþ ñèìâîëîâ,
ââåäåííûõ ñ êëàâèàòóðû

/ / / /
/ / / /
/ /————-/ /
{ }
( * * )
{ <> }
{ } <###> ——

	2	3	4	5	6	7	8	9
2	4	6	8	10	12	14	16	18
3	6	9	12	15	18	21	24	27
4	8	12	16	20	24	28	32	36
5	10	15	16	25	30	35	40	45
6	12	18	24	30	36	42	48	54
7	14	21	28	35	42	49	56	63
8	16	24	32	40	48	56	64	72
9	18	27	36	45	54	63	72	81