Преподаватель который помогает студентам и школьникам в учёбе.

Основы программирования на языке HTML

Содержание:

Введение

HTML (HyperText Markup Language), либо «язык гипертекстовой разметки» — стандартизированный язык разметки документов во Глобальной сети. Крупная часть интернет-страниц использует язык HTML для описания разметки, либо XHTML. Язык HTML интерпретируется браузерами; в итоге интерпретации получаем форматированный текст, который выводится на экран монитора компьютера либо дисплей мобильного устройства.

Язык HTML считается приложением SGML (стандартного обобщённого языка разметки) и соответствует интернациональному стандарту ISO 8879.

Во глобальной сети, при помощи браузерам, HTML-страницы передаются по протоколам HTTP либо HTTPS от сервера, в виде обычного текста либо с использованием шифрования.

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

HTML не задает определенные и точные атрибуты форматирования документа. Конкретный вид документа окончательно определяет лишь программа-браузер на компьютере пользователя Интернета.

HTML также не считается языком программирования, но интернет-страницы могут включать в себя интегрированные программы-скрипты на языках Javascript и Visual Basic Script и программы-апплеты на языке Java.

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

Язык HTML был изобретен учёным из Британии, Тимом Бернерсом-Ли приблизительно в 1986—1991 годах в Швейцарии, в Женеве, в стенах европейской организация по ядерным исследованиям (ЦЕРН). HTML создавался как язык для обмена научной и тех. документацией, удобный для применения людьми, не владеющими особенными умениями в области вёрстки. HTML удачно справлялся с проблемой трудности SGML при помощи определения семантических элементов (дескрипторов) и маленького комплекта структурных и семантических элементов. Дескрипторы еще носят название «тегов». При помощи HTML условно не трудно сформировать простой, однако красиво оформленный документ. Кроме упрощения структуры документа, HTML поддерживает гипертекст. Возможности мультимедиа были добавлены позднее.

Вначале язык HTML задумывался и создавался как средство форматирования документов в отсутствии их привязки к средствам воспроизведения (отображения) и структурирования. В совершенстве, текст с разметкой HTML обязан был воспроизводиться на оборудовании с разной тех. оснащённостью (монохроматический экран органайзера, многоцветный экран современного компьютера, ограниченный по размерам экран мобильного телефона либо устройства и программы голосового воспроизведения слов) в отсутствии стилистических и структурных искажений. Но современное использование HTML очень сильно различается от начальной задачи. К примеру, тег <table> специализирован для создания в документах таблиц, однако совсем нередко употребляется и для оформления размещения элементов на странице. Через некоторое время главная идея платформонезависимости языка HTML была принесена в жертву передовым нуждам в мультимедийном и графическом оформлении.

1. Создание Интернет страницы

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

К примеру, HTML редакторы, такие, как "Netscape Navigator Gold" фирмы Netscape, позволяют создавать документы графически с внедрением технологии WYSIWYG (What You See Is What You Get). С другой стороны, большая часть обычных средств для создания документов имеют конвертеры, позволяющие изменять документы к формату HTML.

2. Основные положения

Все тэги HTML начинаются с "<" (левой угловой скобки) и заканчиваются символом ">" (правой угловой скобки). Как правило, есть стартовый тэг и завершающий тэг. Для образца приведем тэги заголовка, характеризующие текст, находящийся внутри стартового и завершающего тэга и описывающий заголовок документа, регистр при вводе текста не имеет значения:

<TITLE> Заголовок документа </TITLE> либо <title> Заголовок документа </title>.

Завершающий тэг смотрится также, как стартовый, и различается от него прямым слешем перед текстом внутри угловых скобок. В предоставленном образце тэг <TITLE> говорит Интернет-браузеру о применении формата заголовка, а тэг </TITLE> - о завершении текста заголовка.

Некоторые тэги, такие, как (тэг, устанавливающий отступ), не требуют завершающего тэга, однако его внедрение дает начальному тексту документа улучшенную читаемость и структурируемость.

Дополнительные пробелы, знаки табуляции и возврата каретки, добавленные в начальный текст HTML-документа для его наилучшей читаемости, будут проигнорированы Интернет-браузером при интерпретации документа. HTML-документ имеет возможность включать вышеописанные составляющие, лишь если они размещены вовнутрь тэгов.

3. Структура документа

Когда Интернет-браузер получает документ, он описывает, как документ обязан быть интерпретирован. Самый 1-ый тэг, который встречается в документе, обязан быть тэгом <HTML>. Этот тэг сообщает Интернет-браузеру, что ваш документ написан с использованием HTML. Минимальный HTML-документ станет выглядеть так:

<HTML>

...тело документа...

</HTML>

Заголовочная часть документа <HEAD>. Тэг заголовочной части документа обязан быть применен сразу после тэга <HTML> и более нигде в теле документа. Этот тэг дает общее описание документа. Избегайте располагать какой-либо текст внутри тэга <HEAD>. Стартовый тэг <HEAD> помещается конкретно перед тэгом <TITLE> и иными тэгами, описывающими документ, а завершающий тэг </HEAD> располагается сразу после завершения описания документа. К примеру:

<HTML>

<HEAD>

<TITLE>Перечень служащих</TITLE>

</HEAD>

Заголовок документа <TITLE>. Большая часть Интернет-браузеров показывают содержание тэга <TITLE> в заголовке окна, содержащего документ и в файле закладок, ежели он поддерживается Интернет-браузером. Заголовок, ограниченный тэгами <TITLE> и </TITLE>, располагается внутри <HEAD>-тэгов, как показано выше на образце. Заголовок документа не возникает при отображении самого документа в окне.

4. Тэги тела документа

Тэги тела документа идентифицируют отображаемые в окне составляющие HTML-документа. Тело документа имеет возможность содержать гиперссылки на остальные документы, текст и иную форматированную информацию.

Тело документа <BODY>. Тело документа обязано находиться меж тэгами <BODY> и </BODY>. Это та часть документа, которая отражается как текстовая и графическая (смысловая) информация вашего документа.

Значения заголовков <Hx>. Когда пишется HTML-документ, текст структурно распределяется на просто текст, заголовки частей текста, заголовки наиболее высокого уровня и т.д. 1-ый уровень заголовков (самый большой) классифицируется цифрой 1, последующий - 2, и т.д. Большая часть браузеров поддерживает интерпретацию 6 уровней заголовков, характеризуя любому из них свой стиль. Заголовки выше шестого уровня никак не считаются стандартом и могут не поддерживаться браузером. Заголовок самого верхнего уровня имеет признак "1". Синтаксис заголовка уровня 1 последующий:

<H1> Заголовок первого уровня </H1>

Заголовки иного уровня могут быть представлены в едином случае так:

<Hx> Заголовок x-го уровня </Hx>, x - цифра от 1 до 6, характеризующая уровень заголовка.

Тэг абзаца .

В отличии от основной массы текстовых процессоров, в HTML-документе традиционно игнорируются символы возврата каретки. Физический разрыв абзаца может пребывать в любом месте начального текста документа (для удобства его читаемости). Но браузер делит абзацы лишь при наличии тэга . Ежели вы не поделите абзацы тэгом , ваш документ станет выглядеть как один большой отступ.

Дополнительные характеристики тэга :

, позволяют выравнивать отступ по левому краю, центру и правому краю соответственно.

Центрирование частей документа. Вы сможете центрировать все составляющие документа в окне браузера. Для этого можно применять тэг <CENTER>.

Все составляющие меж тэгами <CENTER> и </CENTER> будут пребывать в центре окна. Тэг переформатирования <PRE>. Тэг переформатирования, <PRE>, позволяет изображать текст со специфичным форматированием на экране. Предварительно сформатированный текст заканчивается завершающим тэгом </PRE>. Внутри предварительно сформатированного текста разрешается применять:

а) перевод строчки

б) знаки табуляции (сдвиг на 8 знаков на право)

в) непропорциональный шрифт, устанавливаемый браузером.

Внедрение тэгов, характеризующих формат абзаца, таких как <Hx> либо <ADDRESS>, станет игнорироваться браузером при помещении их меж тэгами <PRE> и </PRE>.

Дальше идет некоторое количество наиболее подробный пример, организованный из прошлых тегов:

<HTML>

<HEAD>

<TITLE> Перечень группы</TITLE>

</HEAD>

<BODY>

<H2> Перечень группы 6-М-11 </H2>

<H3> Составлено: 1 сентября 2013</H3>

Этот перечень охватывает имена, фамилии и отчества.

Перечень имеет возможность быть применен лишь в служебных целях.

</BODY>

</HTML>

Заголовок "Перечень группы" не отображен браузером как часть документа. Он покажется в заголовке окна браузера.

Разрыв строчки . Тэг оповещает браузер о разрыве строчки. Лучший пример применения предоставленного тэга - форматированный адрес либо любая иная очередность строчек, где браузер обязан отображать их одну перед другой. К примеру:

Алексей Ярцев Дмитровское шоссе, д.9Б, кабинет 326

Дополнительный параметр позволяет увеличить возможности тэга .

Этот параметр позволяет не просто выполнить перевод строчки, а расположить последующую строчку, начиная с чистой левой (left), правой (right) либо обоих (all) границ окна браузера. К примеру, ежели рядом с текстом слева встречается изображении, то можно применять тэг для смещения текста ниже изображения:

Как вы можете видеть, предоставленная схема показывает связь <img src="#"justify">Неразрывная строчка . Ежели вы не желаете, чтоб браузер автоматически переносил строчку, то вы сможете обозначить её тэгами и . В данном случае браузер не станет переносить строчку даже если она выходит из-за границы экрана; за место этого браузер позволит горизонтально прокручивать окно. К примеру: Данная строчка считается самой длинной строчкой документа, которая никак не допускает какого-либо разбиения, где бы то ни было

Если же вы желаете все же позволить разбиение данной строчки на 2, однако в строго запланированном месте, то вставьте тэг в это место. К примеру: Данная строчка считается самой длинной строчкой документа, которая не допускает какого-либо разбиения, где бы то ни было

«Данная строчка считается самой длинной строчкой документа, которая не допускает какого-либо разбиения, где бы то ни было.»

Цитата <BLOCKQUOTE>. Этот тэг предназначен для обозначения в документе цитаты из иного источника. Текст, обозначенный тэгом <BLOCKQUOTE>, отходит от левого края документа на 8 пробелов. К примеру: На открытии данной конференции глава консульства сказал: <BLOCKQUOTE> Сегодня один из величайших дней для нашей фирмы. Мы открыли новейшую технологию, позволяющую нашим покупателям повысить продуктивность их настольных систем в несколько раз. </BLOCKQUOTE>

«При отображении браузером этот текст будет смотреться так:

На открытии данной конференции глава консульства сказал:

Сегодня один из величайших дней для нашей фирмы. Мы открыли новейшую технологию, позволяющую нашим покупателям повысить продуктивность их настольных систем в несколько раз.»

5. Описание создания сайта

Гиперссылки

Гиперссылки считаются главным компонентом, делающим WEB симпатичным для юзеров. Добавляя гиперссылки (дальше - гиперссылки), вы делаете комплект документов связанным и структурированием, что позволяет юзеру получать нужную ему информацию очень быстро и комфортно.

Гиперссылки имеют стандартный формат, что позволяет браузеру разъяснять их и выполнять нужные функции (вызывать методы) в зависимости от вида гиперссылки. Гиперссылки могут направлять на иной документ, особое место предоставленного документа либо выполнять иные функции, к примеру, запрашивать файл по FTP-протоколу для отображения его браузером. URL может направлять на особое место по безусловному пути доступа, либо направлять на документ в текущем пути доступа, что нередко применяется при организации больших структурированных Интернет-страниц.

Вы сможете применять гиперссылки как для движения по документу, так и для движения от одного документа к другому. Но HTML не поддерживает возврат на предшествующую гиперссылку, если перемещение происходило внутри документа. Ежели вы применяете гиперссылки внутри документа, а потом нажимаете на кнопку Back, то вы никак не перейдете на предшествующую гиперссылку, а вернетесь на ту часть документа, которую вы просматривали до этого. URL. HTML употребляет URL (Uniform Resource Locator) для представления гиперссылок и ссылок на сетевые сервисы внутри HTML-документа. 1-ая часть URL (до двоеточия) обрисовывает способ доступа либо сетевой сервис. Иная часть URL (после двоеточия) интерпретируется в зависимости от способа доступа. Традиционно, 2 прямых слеша после двоеточия означают имя машины:

method://machine-name/path/foo.html

Последующий пример представляет собой вызов HTML-документа index.html с сервера www.softexpress.com с внедрением HTTP протокола: #"justify"> Uniform Resource Locator имеет последующий формат: method://servername:port/pathname#anchor

Опишем каждый из компонентов URL:. Имя операции, которая станет выполняться при интерпретации предоставленного URL. Более часто применяемые способы: чтение файла с локального диска. Имя файла интерпретируется для локальной машины юзера. Этот способ употребляется для отражения какого-либо файла, пребывающего на машине юзера. Например: file:/home/alex/index.html - показывает файл index.html из каталога /home/alex на пользовательской машине: доступ к Интернет-странице в сети с внедрением HTTP-протокола. (Это более часто применяемый способ доступа к какому-либо HTML-документу в сети). К примеру: #"justify"> mailto: инициирует почтовую сессию с указанным юзером и хостом. К примеру: mailto:info@softexpress.com - активизирует сессию посылки извещения юзеру info на машине softexpress.com, ежели браузер поддерживает пуск электронной почты. Заметьте, что способ mailto: не просит указание слешей после двоеточия (как правило, после двоеточия сразу идет электронный адрес абонента) telnet: обращение к службе telnet: вызов службы новостей, ежели браузер её поддерживает. К примеру: news:relcom.www.support. Необязательный параметр, обрисовывающий полное сетевое имя машины. К примеру: www.softexpress.com - полное сетевое имя сервера компании Софт Сервис.

Ежели имя сервера не указано, то гиперссылка считается локальной, и целый путь, указанный дальше в URL рассчитывается на той машине, с которой взят HTML-документ, сохраняющий эту гиперссылку. Заместо символьного имени машины имеет возможность быть применен IP-адрес, но это не рекомендовано из-за вероятного пересечения с зафиксированными локальными адресами внутренней сети.. Номер порта TCP на котором работает Интернет-сервер. Ежели порт не указан, то "по умолчанию" употребляется порт 80. Этот параметр (port) не употребляется в основной массе URL.. Отдельный либо целый путь к документу, который обязан вызваться в итоге интерпретации URL. Разные Интернет-сервера сконфигурированы по различному для интерпретации пути доступа к документу. К примеру, при применении CGI скриптов (выполняемых программ), они обычно собираются в одном либо нескольких выделенных каталогах, путь к которым записан в особых параметрах Интернет-сервера. Для этих каталогов Интернет-сервером выделяется особый логический путь, который и употребляется в URL. Ежели Интернет-сервер видит этот путь, то запрашиваемый файл интерпретируется как выполняемый модуль. В противном случае, запрашиваемый файл интерпретируется просто как файл данных, в том числе ежели он считается выполняемым модулем. К примеру: #"justify"> В предоставленном примере HTTP-сервер обязан вызвать CGI-скрипт с именем handle.exe, который располагаться на машине с сетевым именем www.softexpress.com. Путь к этому скрипту - /cgi-win/ - в реальности считается виртуальным путем (выделенным сервером для выполняемых модулей). Заметьте, что при описании пути употребляется UNIX-схожий синтаксис, где, в отличии от DOS и Windows употребляются прямые слеши заместо обратных. Ежели после сетевого имени машины сходу идет имя документа, то он обязан пребывать в корневом каталоге на удаленной машине либо (что чаще) в каталоге, выделенном Интернет-сервером в качестве корневого. Ежели же URL кончается сетевым именем машины, то в качестве документа запрашивается документ из корневого каталога удаленной машины с именем, установленным в опциях Интернет-сервера (как правило, это index.html).

#ANCHOR. Этот элемент считается гиперссылкой на строчку (точку) внутри HTML-документа. Большая часть браузеров, встречая после имени документа этот элемент, располагают документ на экране таковым образом, что отмеченная строчка документа помещается в верхнюю строчку рабочего окна браузера. Точки, на которые ссылается #anchor, указываются в документе при помощи тэга NAME, как это будет описано дальше.

Структура гиперссылок в HTML-документе. Пока что мы рассмотрели лишь наружный вид URL. Для того, чтоб браузер показал гиперссылку на URL, нужно пометить URL особыми тэгами в HTML-документе. Синтаксис HTML, позволяющий это совершить - последующий:

<A HREF="URL"> текст-который-станет-подсвечен-как-гиперссылка </A>

Тэг <A HREF="URL"> раскрывает описание гиперссылки, а тэг </A> - закрывает его. Хоть какой текст, находящийся меж данными 2-мя тэгами подсвечивается особым образом Интернет-браузером. Традиционно данный текст отражается подчеркнутым и выделен голубым (либо иным данным юзером) расцветкой. Текст, означающий URL, не отражается браузером, а используется лишь для исполнения указанных им действий при активизации гиперссылки (обычно при щелчке мыши на подсвеченном либо подчеркнутом тексте). Вот пример сектора HTML-документа:

Для получения образца смотри <a href="http:/www.ruswebmasters.com/index.htm> страницу </a>

Гиперссылки на точки внутри документа. Вы сможете совершать гиперссылки на разные участки либо сегменты 1-го и того же документа, применяя особый сокрытый маркер для данных разделов. Это позволяет быстро переходить от раздела к разделу внутри документа, не применяя прокрутку экрана. Как только вы щелкнете на гиперссылке, браузер переместит вас на подтвержденный раздел документа, а строчка, в которой стоит маркер предоставленного раздела (обычно, 1-ая строчка раздела либо заголовок раздела) станет расположена на первой строке окна браузера (если данная строка не присутствует уже на экране браузера).

Для создания такой гиперссылки нужно исполнить последующие шаги:

. Создайте маркер раздела. Синтаксис предоставленного маркера последующий:

<A NAME="named_anchor"> Текст-который-отобразится-в-первой-строчке </A>

Создайте гиперссылку на этот маркер:

<A HREF="#named_anchor"> Текст </A>

К примеру:

Перечень разделов <ul> <li><a href="#ex1">Раздел 1</a></li> <li><a href="#ex2">Раздел 2</a></li> </ul> <a name="ex1"></a>Раздел 1 <ul> Текст раздела 1 </ul> <a name="ex2"></a>Раздел 2 <ul> Текст раздела 2

Символы "#ex1" докладывает вашему браузеру, что нужно отыскать в предоставленном HTML-документе маркер с именем "ex1".

Когда юзер щелкнет мышью на строчке "Раздел 1", браузер перейдет сразу к разделу 1. Графика внутри документа

Одна из более симпатичных черт Web - возможность включения гиперссылок на графические и другие разновидности данных в HTML-документ. Делается это при помощи тэга <IMG...ISMAP>. Внедрение предоставленного тэга позволяет существенно повысить внешний вид и работоспособность документов.

Есть 2 метода применения графики в HTML-документах. Первый - это введение графических образов в документ, что позволяет юзеру видеть изображения конкретно в контексте остальных частей документа. Это наиболее применяемая техника при конструировании документов, именуемая иногда "inline image". Синтаксис тэга:

Опишем составляющие синтаксиса тэга:

Обязательный параметр, имеющий такой же синтаксис, как и обычный URL. Этот URL показывает браузеру где находится изображение. Изображение обязано храниться в графическом формате, поддерживаемом браузером. На нынешний день форматы GIF и JPG поддерживаются основной массой браузеров. = "text":

Этот необязательный элемент задает текст, который станет отображен браузером, никак не поддерживающим отражение графики либо с отключенной подкачкой изображений. Традиционно, это краткое отображение изображения, которое юзер может либо сможет увидеть на экране. Ежели этот параметр отсутствует, то на месте рисунка большая часть браузеров выводит пиктограмму (иконку), активизировав которую, юзер имеет возможность увидеть изображение. Тэг ALT рекомендуется, ежели ваши юзеры применяет браузер, не поддерживающий графический режим, к примеру Lynx. = n1:

Этот необязательный параметр употребляется для указания вышины рисунка в пикселях. Ежели этот параметр не указан, то употребляется оригинальная вышина рисунка. Это параметр позволяет сжимать либо вытягивать изображения сообразно вертикали, что позволяет наиболее верно определять внешний вид документа. Но, некоторые браузеры не поддерживают этот параметр. С иной стороны, экранное разрешение у вашего клиента может различаться с вашим, потому будьте внимательны при задании безусловной величины графического объекта. = n2:

Параметр также необязателен, как и предшествующий. Позволяет установить безусловную ширину рисунка в пикселях.: Этот параметр употребляется, чтоб сказать браузеру, куда поместить последующий блок текста. Это позволяет наиболее строго установить размещение элементов на экране. Ежели этот параметр не употребляется, то большая часть браузеров располагает изображение в левой части экрана, а текст справа от него.:

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

Приведем пример применения этого тэга:

<IMG SRC="#"justify"> С версии HTML 2.0 у тэга <IMG> возникли доп характеристики:

Новые характеристики:

Этот параметр позволяет создателю найти ширину рамки вокруг рисунка.:

Позволяет определить величину в пикселях пустого места над и под рисунком, чтоб текст не наезжал на изображение. В особенности это принципиально для динамически создаваемых изображений, когда невозможно заблаговременно увидеть документ.:

То же самое, что и VSPACE, однако лишь сообразно горизонтали.

Фоновые Изображения. Большая часть браузеров позволяет включать в документ фоновый изображение, которое станет матрицироваться и отражаться на фоне всего документа. Некоторые юзеры обожают фоновую графику, некоторые нет. Неназойливое полупрозрачное изображение (обои) обычно отлично смотрится в качестве фона для основной массы документов.

Описание фонового рисунка включается в тэг BODY и смотрится последующим образом:

<BODY BACKGROUND="picture.gif">.

Задание обычных расцветок. Почти все HTML-создатели любят применять заранее предопределенные расцветки фона документа, обычного текста и гиперссылок. Чтоб установить эти расцветки, нужно подключить в тэг <BODY> доп. характеристики:

<BODY BGCOLOR="#XXXXXX" TEXT="#XXXXXX" LINK="#XXXXXX"> любая из характеристик описывает цвет того либо иного элемента. Опишем эти характеристики:

Цвет фона документа:

Цвет обычного текста документа:

Цвет гиперссылки. Цвет задается шестизначным числом в шестнадцатеричном формате сообразно схеме RGB (Red, Green, Blue). Цвет #000000 соответствует черному, а цвет #FFFFFF - белому. К примеру: <BODY BGCOLOR="#000000" TEXT="#FFFFFF" LINK="#9690CC">

Предоставленная строчка описывает белый цвет фона документа, темный текст и серебристые гиперссылки.

Горизонтальная линия. Применяя тэг <HR>, вы сможете поделить текст горизонтальной чертой.

Формат тэга:

Характеристики тэга:

Толщина линии в пикселях.:

Широта линии в пикселях либо процентах от ширины окна браузера.: Размещение на экране (слева | по центру | справа).: По умолчанию линия представлена в 3D виде с тенью. NOSHADE позволяет представить линию просто монотонной черной полосой.

Таблицы

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

Таблица полностью содержится в пару скобок

<TABLE>

</TABLE>

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

Клетки (ячейки) таблицы задаются в порядке горизонтальных рядов слева направо:

Клетка 1 Клетка 2 Клетка 3

Клетка 4 Клетка 5 Клетка 6

Любой горизонтальный ряд содержится в скобках

<TR>

</TR>

а любая клетка внутри ряда в скобки

<TD>

</TD>

Таблица, приведённая выше, была задана так:

<tr><td>Клетка 1</td>

<td>Клетка 2</td>

<td>Клетка 3</td></tr>

<tr><td>Клетка 4</td>

<td>Клетка 5</td>

<td>Клетка 6</td></tr>

</table>

В данном примере для задания ширины линий рамки указан атрибут BORDER. Число после основного слова задает ширину рамки в пикселях. Значение BORDER=0 указывает на неимение линий рамки.

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

Для <TABLE> можно установить:

WIDTH=число либо WIDTH=процент%

Тут указывается предпочитаемая ширина таблицы в пикселях либо процентах от ширины окна, причём во втором случае целое число сопровождается символом %.

Подобно

HEIGTH=число либо HEIGTH=процент%

задает желаемую вышину таблицы в пикселях либо процентах.

Таблицу можно выровнять на лево, вправо либо по центру окна методом указания соответственно

ALIGN=LEFT

ALIGN=RIGHT

ALIGN=CENTER

Для <TD> можно указать характеристики отдельной ячейки:

ALIGN=LEFT

ALIGN=RIGHT

ALIGN=CENTER

задает выравнивание по горизонтали текста внутри ячейки на лево, вправо либо по центру соответственно.

VALIGN=TOP

VALIGN=BOTTOM

VALIGN\MIDDLE

задает вертикальное выравнивание - по верхнему краю, по нижнему либо посередине.

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

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

WIDTH=число WIDTH=процент%

HEIGTH=число HEIGTH=процент%

Подобно расцветки фона и фоновому изображению для страницы в целом можно установить их для ячейки таблицы. Параметры те же:

BGCOLOR=цвет

BACKGROUND=изображение

6. Добавление стилей в документ

позволяет применять разные стили шрифтов для выделения текстовой информации в ваших документах. Вот маленький перечень стилей, поддерживаемых основной массой браузеров:(жирный)(косой)spaced (type writer - с использованием фиксированных шрифтов)

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

Основные стили текста

СтильЭлемент либо тэгРезультатBold Данный текст жирный Данный текст жирныйItalic Данный текст косой Данный текст наклонныйMono spaced<TT> Данный текст с непроп. шрифтом </TT>Данный текст с непроп. шрифтом

Комбинирование стилей позволяет вам отображать в одной строчке некоторое количество элементов разными стилями, к примеру:

Жизнь - это песня!

Жизнь - это песня!

Добавление огромного количества стилей и их комбинаций приводит к затруднению чтения слова!

Дополнительные стили:

· big (большой)

· small (маленький)

· sub (подстрочник)

· sup (надстрочник)

Дополнительные стили текста

Стиль Элемент либо тэг Результат Big Этот текст <BIG> большой </BIG>Данный текст большой Small Этот текст маленький Данный текст маленькийSubЭтот текст подстрочник Данный текст подстрочникSupЭтот текст надстрочник Этот текст надстрочник

Величина шрифта . Вы сможете видоизменять величину шрифта при помощи тэга:

Шрифт может иметь величину от 1 до 7. Вы сможете напрямик указать величину шрифта цифрой, либо указать смещение относительно базисного значения (по умолчанию - 3) в положительную либо отрицательную сторону. Базисное значение можно поменять при помощи тэга: <BASEFONT SIZE=n>

К примеру: и зм ен ен и е

Изменение расцветки шрифта . Вы сможете поменять расцветку шрифта при помощи тэга:

Расцветка указывается в RGB-формате (Red-Green-Blue) посредством указания размерности каждой составляющие расцветки в шестнадцатеричном формате. К примеру, белый цвет обозначается "000000", черный - "FFFFFF", синий - "0000FF" и т.п.

Красный Зеленый Синий.

Оптимизация графики для web

На этот эпизод в Web используется 2 вида растровых файлов: в форматах JPEG и GIF.формат отлично передает цветовые и тоновые раскаты, размытые границы (к примеру, фото). JPEG-файл отлично масштабируется в браузере. Нехорошо передает ровные плоскости цвета, в компрессии уступает GIF-формату. При сохранении в JPEG-формате выбирайте качество "medium".формат хорошо передает ровные плоскости расцветки, жесткие границы (к примеру, векторную графику, логотипы). Имеет максимальную компрессию, допускает прозрачный фон. Нехорошо масштабируется в браузере, искажает цветовые и тоновые раскаты. Применяйте GIF-формат, ежели изображение в отсутствии значимых утрат переводится в 128-цветовую палитру с включенной опцией "dithering". В противном случае лучше сохранять изображение в JPEG-формате. Для экспорта файла в GIF-формат сначала проиндексируйте его цветовую гамму в Adobe Photoshop:

Выбирайте малое количество расцветок вручную (для качественной передачи антиалиасного одноцветного изображения на одноцветном фоне довольно 5-8 расцветок, 2-ух-трехцветного изображения - 15-25 расцветок) Ежели начальное изображение Grayscale, пред индексацией переведите его в RGB-палитру.

По возможности опасайтесь включения функции "dithering"- она увеличивает размер файла. Данная функция нужна, только ежели в изображении находится цветовой либо тоновой раскат (напр. тень). Назначая бесцветный фон, после применения "dithering" удостоверьтесь, что фон не стал "клетчатым".

В трудных вариантах пред индексированием выделите более принципиальные составляющие изображения. Расцветки внутри выделенной области индексируются корректнее остальных.

Заключение

Данная тема была выбрана по нескольким причинам. Одна из самых существенных причин в том, что за всемирной компьютерной сетью Internet будущее. И любой человек сознает, что знание Internet необходимо и ему. Но так как информации в сети достаточно большое количество и она “разбросана” по огромному количеству серверов, необходимо уметь и знать как ее находить.

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

В работу вошел материал основанный на материале, который я искал в библиотеках.

Можно работать на Web без знания языка HTML, так как тексты HTML могут создаваться различными специальными редакторами и конвертерами. Писать непосредственно на HTML нетрудно. Возможно, это даже легче, чем изучать HTML-редактор или конвертер, которые часто ограничены в своих возможностях, содержат ошибки или производят плохой HTML код, который не работает на различных платформах.

Язык HTML существует в нескольких вариантах и продолжает развиваться, но конструкции HTML вероятнее всего будут использоваться и в дальнейшем. Изучая HTML и познавая его глубже, создавая документ в начале изучения HTML и расширяя его насколько это возможно, Вы сможете создавать документы, которые могут быть просмотрены многими браузерами Web, как сейчас, так и в будущем. Это не исключает возможности использования других методов, например, метод расширенных возможностей, предоставляемый Netscape Navigator, Internet Explorer или некоторыми другими программами. Работа с HTML - это способ усвоить особенности создания документов в стандартизированном языке, используя расширения, только когда это действительно необходимо.

HTML был ратифицирован World Wide Web Consortium. Он поддерживается несколькими широко распространенными браузерами, и, возможно, станет основой почти всего имеющего отношение к Web программного обеспечения.

Список литературы

1. Гончаров А. Самоучитель HTML. С.-Пб: Питер, 2000.

2. Гончаров А. HTML в примерах. С.-Пб.: Питер, 2003.

3. Информатика: Учебник/под ред. Н.В. Макаровой. - М.: Финансы и статистика, 2000. - 768 с.

4. Информатика. Базовый курс. Учебник для Вузов/под ред. С.В. Симоновича. СПб.: Питер, 2000.

5. Информатика. Компьютерная техника. Компьютерные технологии. / Пособие под ред. О.И.Пушкаря. Киев Издательский центр "Академия". 2001.

6. Комягин А.О. Современный самоучитель работы на персональном компьютере. М.: ТРИУМФ, 2003.

7. Ковтанюк Ю.С., Соловьян С.В. Самоучитель работы на персональном компьютере. К.: Юниор, 2001.

8. Симонович С.В., Евсеев Г.А. Практическая информатика. Учебное пособие. М.: АСТпресс, 2001.

9. Симонович С.В., Евсеев Г.А., Алексеев А.Г. Специальная информатика. Учебное пособие. М.: АСТпресс, 2001.

10. Матросов А. HTML 4.0. М.: Дело, 2005.

11. Основы современных компьютерных технологий: Учебное пособие / Под. ред. Хомоненко. С.-Пб.: КОРОНА, 2002.

12. Острейковский В.А. Информатика. М.: Высшая школа, 2001.

13. Хеслоп П. HTML самого начала. С.-Пб: Санкт-Петербург, 2005.

14. Шафран Э. Создание Web страниц. С.-Пб: Питер, 2004.