Назначение языка разметки документов HTML. Синтаксис HTML. Основные теги языка HTML

Федеральное государственное  бюджетное образовательное учреждение высшего профессионального образования

 «Вологодский  государственный технический университет»

 

 

 

 

 

РЕФЕРАТ

 

 

 

Дисциплина: «Информатика»

Наименование темы: «Назначение  языка разметки документов HTML. Синтаксис HTML. Основные теги языка HTML»

 

 

 

Руководитель	Сорокин Станислав Валентинович
Выполнил (а) студент	Маликова Вероника Владимировна
Группа, курс	ЗДФК-21, 2 - курс
Дата сдачи	4 декабря 2013
Оценка	______________________________________ _______________________________________ (подпись преподавателя)

 

 

 

 

 

 

Вологда

2013 г.

 

Содержание:

1. Введение………………………………………………………………………3

2. Назначение языка разметки документов NTML……………………………3

3. Синтаксис NTML……………………………………………………………..4

4. Основные теги языка NTML…………………………………………………5

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

1. Введение 

Глобальная Сеть не только соединила  пользователей всего мира, но и  утвердилась в виде новых технологий на наших персональных компьютерах. Действительно, пользователь, который приобрел и установил на своей машине Microsoft Office 97, становится обладателем Internet-технологии в готовом виде, независимо от того, подключен его компьютер к Сети или нет.

Иными словами, средства, предназначенные  для работы с Сетью, стали использоваться и в других целях, с нею не связанных, а среди программного обеспечения, устанавливаемого на большинство персональных компьютеров, приложения для Internet заняли свое почетное место.

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

 

2.Назначение языка разметки документов NTML.

 

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

Проще говоря, благодаря HTML мы сможем определить, какая  же все-таки часть документа является лишь текстом, какая заголовком и  что же необходимо выделять. Более  того, будет предоставлена возможность  понять, в каком месте следует  находиться графическим изображениям.

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

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

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

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

HTML является  упрощенной версией стандартного общего языка разметки - SGML (Standart Generalised Markup Language), который был утвержден ISO в качестве стандарта еще в 80-х годах. Этот язык предназначен для создания других языков разметки, он определяет допустимый набор тэгов, их атрибуты и внутреннюю структуру документа. Контроль за правильностью использования дескрипторов осуществляется при помощи специального набора правил, называемых DTD- описаниями(более подробно о DTD мы поговорим чуть позже), которые используются программой клиента при разборе документа. Для каждого класса документов определяется свой набор правил, описывающих грамматику соответствующего языка разметки. С помощью SGML можно описывать структурированные данные, организовывать информацию, содержащуюся в документах, представлять эту информацию в некотором стандартизованном формате. Но в виду некоторой своей сложности, SGML использовался, в основном, для описания синтаксиса других языков(наиболее известным из которых является HTML), и немногие приложения работали с SGML- документами напрямую.

 

3.Синтаксис языка HTML.

Любая HTML страница состоит из элементов, которые занимают определенное место  в окне браузера и обладают определенными  свойствами по отношению к друг другу  и документу в целом.

Для описания свойств элементов HTML страницы в языке HTML используются теги - символьное наименование элемента, заключенное в угловые скобки: <a>, <table>, <div>, <layer> и т.д.

Символы, заключенные  в угловые скобки, служат названием  тега и называются операторами

Для описания свойств операторов используются атрибуты и их значения.

Язык HTML, так  же как и любой другой язык, имеет  правила, иначе называемые синтаксисом (правила написания понятного  для браузера кода):

Правило 1. Парный тег состоит из двух тегов - открывающий и закрывающий. Закрывающий тег в парном теге начинается со слеша. Пример: <a> ... </a>

Правило 2. Непарный тег всегда должен заканчиваться слешем. Пример:

<img src="/..." />

Правило 3. Наименование атрибута пишется внутри открывающего тега после наименования оператора. Пример: <a href="/"> ... </a>

Правило 4. Знак равенства присваивает атрибуту значение. Значение атрибута должно быть заключено в кавычки. Пример: <table border="1"></table>

Общий синтаксис  для парных тегов: <оператор атрибут="свойство"></оператор>

Общий синтаксис для не парных тегов: <оператор атрибут="свойство" />

Правило 5. Теги должны закрываться в обратном порядке их открытия. Это правило относится к вложенным тегам. Пример:

<table> 
    <tr> 
        <td> 
             ... 
        </td> 
   </tr> 
</table>

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

<table bgcolor="red"> 
    <tr> 
         <td> 
              ... 
         </td> 
    </tr> 
</table>

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

<table bgcolor="red"> 
     <tr> 
        <td bgcolor="green"> 
           table 1 
        </td> 
        <td> 
           table 2 
        </td> 
     </tr> 
</table>

 

 

4.Основные теги языка HTML.

 

Основные теги

<html></html> – Указывает веб–обозревателю, что это HTML документ.

<head></head> – Определяет место,  где помещается различная

информация не отображаемая в теле документа. Здесь располагается  тег

названия документа и теги для  поисковых машин.

<body></body> – Определяет видимую  часть документа

Теги оглавления

<title></title> – Помещает название  документа в оглавление программы

просмотра страниц

Атрибуты тела документа

<body bgcolor=?> – Устанавливает цвет  фона документа, используя

значение цвета в виде RRGGBB –  пример: FF0000 – красный цвет.

<body text=?> – Устанавливает цвет текста документа, используя

значение цвета в виде RRGGBB –  пример: 000000 – черный цвет.

<body link=?> – Устанавливает цвет  гиперссылок, используя значение

цвета в виде RRGGBB – пример: 00FF00 –  зеленый цвет.

<body vlink=?> – Устанавливает цвет уже посещенных гиперссылок,

используя значение цвета в виде RRGGBB – пример: 333333 – серый цвет.

<body alink=?> – Устанавливает цвет  гиперссылок при нажатии.

Теги для форматирования текста

<pre></pre> – Обрамляет предварительно  отформатированный текст.

<h1></h1> – Создает заголовок  первого уровня

<h6></h6> – Создает заголовок  шестого уровня

<b></b> – Создает жирный  текст

<i></i> – Создает наклонный  текст

<em></em> – Используется для  выделения из текста слова  (наклонный

или жирный текст)

<strong></strong> – Используется для выделения наиболее важных

частей текста (наклонный или  жирный текст)

<font size=?></font> – Устанавливает  размер текста в пределах от 1 до 7.

<font color=?></font> – Устанавливает  цвет текста, используя значение

цвета в виде RRGGBB.

Гиперссылки

<a href="URL"></a> – Создает  гиперссылку на другие документы  или

часть текущего документа.

<a href="mailto:EMAIL"></a> – Создает  гиперссылку вызова почтовой

программы для написания письма автору документа.

<a name="NAME"></a> – Отмечает  часть текста как цель для

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

<a href="http://www.cyberguru.ru/#NAME"></a> – Создает гиперссылку

на часть текущего документа.

Форматирование

<p> – Создает новый параграф

<p align=?> – Выравнивает параграф  относительно одной из сторон

документа, значения: left, right, или center

<br> – Вставляет перевод строки.

<blockquote></blockquote> – Создает  отступы с обеих сторон

текста.<dl></dl>Создает список определений.

<dt> – Определяет каждый из  терминов списка

<dd> – Описывает каждое определение

<ol></ol> – Создает нумерованный  список

<li> – Определяет каждый элемент  списка и присваивает номер3

<ul></ul> – Создает ненумерованный  список

<li> – Предваряет каждый элемент  списка и добавляет кружок  или

квадратик.

<div align=?> – Важный тег используемый для форматирования больших

блоков текста HTML документа, также  используется в таблицах стилей

Графические элементы

<img src="name"> – Добавляет  изображение в HTML документ

<img src="name" align=?> – Выравнивает  изображение к одной из сторон

документа, принимает значения: left, right, center; bottom, top, middle

<img src="name" border=?> – Устанавливает  толщину рамки вокруг

изображения

<hr> – Добавляет в HTML документ  горизонтальную линию.<hr size=?

>Устанавливает высоту(толщину)  линии

<hr width=?> – Устанавливает ширину линии, можно указать ширину в

пикселах или процентах.

<hr noshade> – Создает линию без  тени.

<hr color=?> – Задает линии определенный  цвет. Значение RRGGBB.

Таблицы

<table></table> – Создает таблицу.

<tr></tr> – Определяет строку  в таблице.

<td></td> – Определяет отдельную  ячейку в таблице.

<th></th> – Определяет заголовок  таблицы (по умолчанию, нормальная

ячейка с жирным текстом по центру)

Атрибуты таблицы

<table border=#> – Задает толщину  рамки таблицы.

<table cellspacing=#> – Задает расстояние между ячейками таблицы.

<table cellpadding=#> – Задает расстояние  между содержимым ячейки и

ее рамкой.

<table width=#> – Устанавливает ширину  таблицы в пикселах или 4 процентах от ширины документа.

<tr align=?> или <td align=?> – Устанавливает  выравнивание ячеек в таблице, принимает значения: left, center, или right.

<tr valign=?> или <td valign=?> – Устанавливает  вертикальное выравнивание для ячеек таблицы, принимает значения : top, middle, или bottom.