Лекции (989962), страница 43
Текст из файла (страница 43)
Тэг состоит из трехэлементов:Таблица 8.1.Структура тэгаЭлемент1. Начало тэга2. Тело тэга3. Конец тэгаСинтаксис<тэг параметр1=значение1 параметрN=значениеN>содержимое, зависит от самого тэга</тэг>Пример<TABLE WIDTH=50></TABLE>Поскольку тэги распознаются и выполняются web-браузером, то язык HTML не зависит от типакомпьютера. Существует множество различных тэгов, позволяющих включать в HTML-страницу таблицы,рисунки, гиперссылки, задавать шрифт и цвет фона, и даже встраивать в страницу программы, написанныена языках Java, Java-script и VBScript. Однако для того, чтобы тэги работали, они должны быть правильноорганизованы.
Браузеры не выполняют неизвестные или не правильно записанные тэги, благодаря чемудостигается надежность HTML: даже если вы все сделаете не правильно – взрыва не произойдет, простоправильные команды будут выполнены, а не правильные или неизвестные браузер проигнорирует.Ниже будут рассмотрены некоторые основные тэги HTML-документа.
Конечно, можно не зная ниодного тега создать HTML-документ при помощи специализированных программ, таких как MS Front Page,или, на худой конец, создать документ Word с гиперссылками и сохранить его в формате HTML. Однакополезно знать хотя бы минимум информации по языку HTML, что повысит эффективность работы (т.к.специализированные программы порой создают крайне не эффективный HTML-код) и позволит использовать чужие HTML-странички для разработки собственных. Ведь для того, чтобы просмотреть HTML-кодпонравившегося сайта, достаточно дать команду “Просмотр в виде HTML” в контекстном меню InternetExplorer и подправить его при помощи "Блокнота" или любого другого текстового редактора, позволяющегосохранять файл в формате "Только текст".
Базовая структура HTML-документа представлена ниже:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> Это заголовок HTML-документа, однако!</TITLE></HEAD><BODY> А это содержимое HTML-документа, однозначно !!! </BODY></HTML>Здесь тэги обозначают следующее:Таблица 8.2.Тэги структуры HTML-документа.Тэг<!DOCTYPE HTMLPUBLIC "-//W3C//DTD HTML 4.0Transitional//EN"><HTML> </HTML><HEAD> </HEAD><TITLE> </TITLE>ЗначениеТег указывает на то, что данный документ является документом HTML и указываетверсию HTML. Фактически, этот тег является комментарием HTML и не обязателен.
Однако, учитывая существование документов XML, его желательно указывать.Указывают на начало и конец HTML-документа. Любой HTML-документ долженбыть заключен в эти тэги. В тэге HTML иногда указывается версия языка HTMLиспользованная при написании этого документа.Начало и конец заголовка документа. В заголовке обычно указывается различнаяслужебная информация: ключевые слова, тип кодировки документа и т.д. Это полеобычно просматривают поисковые сервера для того, чтобы определить содержимоедокумента.Текст, заключенный между этими тэгами, отображается в заголовке окна InternetExplorer при просмотре HTML-документа. Ляхевич А.Г., 2000 - 2002 годПродолжение табл.
8.2.ЗначениеСодержимое HTML-документа. Тэг BODY может иметь следующие параметры:text –цвет текста документа. Название цвета указывается английским словомили в RGB. Пример: <BODY text="yellow"> или text="#FFFF00".background – фоновая картинка документа. Пример: <BODY background="fon.gif">.bgproperties – при задании этому параметру значения fixed, фоновая картинка небудет прокручиваться вместе с документом, т.е. будет неподвижна.Пример: <BODY bgproperties="fixed">bgcolor – цвет фона документа.
Если указать одновременно и параметр background ипараметр bgcolor, то цвет фона документа будет отображаться только еслине удастся загрузить фоновую картинку.nowrap– при задании этого параметра, строчка, не помещающаяся в окне, не будетпереносится на новую строку (появятся полосы прокрутки).Пример: <BODY nowrap>link – цвет гиперссылок в документе.
alink – цвет активных (выделенных)гиперссылок в документе, vlink – цвет посещенных гиперссылок в документе.В заголовке, при помощи тэга <META> полезно указать ключевые слова (keywords) и кодировку (charset)документа. Ключевые слова используются поисковыми машинами Internet, при анализе содержимогодокумента. Кодировка важна для правильного отображения языка документа. В рамках тэга <BODY></BODY> пишется содержимое всего остального документа, в виде обычного текста, заключенного в тэгиформатирования, а также другие специальные тэги.Пример:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE>Пример HTML-документа</TITLE><META name="keywords" content="ключевое слово1, ключевое слово2, ключевое слово3"><META content="text/html; charset=windows-1251" http-equiv="Content-Type"></HEAD><BODY text="blue" bgcolor="yellow" background="fon.gif" bgproperties="fixed" link="green" alink="red"nowrap><!-- Это комментарий.
Отображаться на экране не будет --><B>Этот текст будет выведен жирным (Bold) шрифтом </B><CENTER><I><B><U> Этот текст будет выведен по центру (Center), наклонным (Italic), жирным (Bold) иподчеркнутым (Underline) шрифтом </U></B></I></CENTER><H1> Это текст заголовка (Heading), самый крупный </H1><H6> Это текст заголовка (Heading), самый мелкий </H6><FONT face="Times" size="7" color="white"> Этот текст будет выведен шрифтом Times, размером 7(размеры от 1 до 7), белым цветом </FONT><BR> Здесь будет новая строка (BR = Break). Тэг BR закрывать не надо.<HR size="5px" width="70%" align="left" > Здесь будет горизонтальная линия: толщина=5 пикселей, длина=70% экрана (можно в пикселях), выравнивание – по левому краю страницы.
Тэг HR закрывать не надо.<PRE> Текст, расположенный между тэгами PRE, будет выводится на экран "как есть", т.е. с учетом вводов,пробелов и т.п. </PRE><A HREF="http://www.microsoft.com"> Этот текст будет гиперссылкой </A><A NAME="Metka"> Этот текст будет помечен закладкой (Anchor) с именем Metka </A><A HREF="#Metka"> Вот так, внутри документа, можно сделать гиперссылку на созданную выше закладкуMetka для быстрого перехода по тексту документа </A><A HREF="../../katalog/file.html#Metka3"> Вот так можно сделать гиперссылку на конкретное место(закладку Metka3) файла file.htm, находящийся на два каталога выше, в папке katalog </A><IMG src="http://microsoft.com/risunok.gif" alt="Тэг IMG отображает рисунок из файла risunok.gif, размером300x200 пикселей, без рамки (рамка=0), а текст, который вы читаете, будет отображен, если рисунок неудасться загрузить" width="300px" height="200px" border="0"><!-- А вот так (см.
ниже) можно сделать гиперссылку в виде рисунка. --><A HREF="http://www.microsoft.com"> <IMG src="risunok.gif"> </A></BODY></HTML>Тэг<BODY> </BODY>Создание таблиц в HTMLСреди других тэгов отдельного внимания заслуживает тэг TABLE, отвечающий за создание таблиц.Таблицы можно использовать как непосредственно, так и для привязки текста к определенному местуэкрана.
Так, например, обтекание рисунка текстом справа, в рамках HTML проще всего сделать, создав 2 Ляхевич А.Г., 2000 - 2002 годячейки таблицы: в левой – рисунок, в правой – текст, толщина рамки - 0. Ниже, для примера, приведенHTML-код и показана таблица, которую он создает:Понедельник18Вторник29ДекабрьСредаЧетвергПятница345101112рис 8.1. Пример создаваемой таблицы.Суббота613Воскресенье714<TABLE width="500px" border="5" align="Left"><TBODY><TR> <TH align="Center" valign="Middle" colspan="7"> Декабрь </TH> </TR><TR Align="Center"><TH>Понедельник</TH> <TH>Вторник</TH> <TH>Среда</TH> <TH>Четверг</TH><TH>Пятница</TH> <TH>Суббота</TH> <TH>Воскресенье</TH> </TR><TR valign="Top"><TD>1</TD> <TD>2</TD> <TD>3</TD> <TD>4</TD> <TD>5</TD> <TD>6</TD> <TD>7</TD> </TR><TR valign="Top"><TD>8</TD> <TD>9</TD> <TD>10</TD> <TD>11</TD> <TD>12</TD> <TD>13</TD> <TD>14</TD></TR></TBODY></TABLE>Здесь тэги и параметры тэгов имеют следующее значение:Таблица 8.3.Тэги создания таблицы.Тэг<Tablе> </Table><TBODY></TBODY>BorderWidthAlign<TR> </TR><TH> </TH><TD> </TD>ValignColspanRowspanЗначениеначало и конец таблицы.тело таблицытолщина рамки таблицы.ширина таблицы либо в пикселях, либо в процентах ко всему пространству.выравнивание содержимого ячеек (right, left, center).начало и конец строки таблицы.начало и конец ячейки шапки таблицы.начало и конец обычной ячейки таблицы.вертикальное выравнивание содержимого ячеек (bottom, middle, top).количество столбцов, объединяемых данной ячейкой.количество строк, объединяемых данной ячейкой.Создание форм в HTMLНаибольший интерес для разработчика Web-страниц представляют формы.
![](https://s.studizba.com/z.php?f=/templates/si/i/noavatar.png&w=100&h=100&t=1"){kind=avatar}
