SlideShare a Scribd company logo
Язык Html
HTML ( HyperText Markup Language — «язык гипертекстовой разметки») —
стандартный язык разметки документов во Всемирной паутине. Большинство
веб-страниц содержат описание разметки на языке HTML (или XHTML). Язык
HTML интерпретируется браузерами; полученный в результате интерпретации
форматированный текст отображается на экране монитора компьютера или
мобильного устройства.
Язык HTML является приложением SGML (стандартного обобщённого языка
разметки) и соответствует международному стандарту ISO 8879.
Язык XHTML является более строгим вариантом HTML, он следует всем
ограничениям XML и, фактически, XHTML можно воспринимать как
приложение языка XML к области разметки гипертекста.
Во всемирной паутине HTML-страницы, как правило, передаются браузерам от
сервера по протоколам HTTP или HTTPS, в виде простого текста или с
использованием шифрования.
Основные теги языка:
<html></html>
Указывает программе просмотра страниц, что это HTML документ.
<head></head>
Определяет место, где помещается различная информация не отображаемая
в теле документа. Здесь располагается тег названия документа и теги для
поисковых машин.
<body></body>
Определяет видимую часть документа
<html> <head> <title>Название страницы</title> </head> <body>
<h1>Заголовок статьи</h1> <p> Абзац статьи.</p> </body> </html>
Теги оглавления:
<title></title>
Помещает название документа в оглавление программы просмотра
страниц
<html> <head> <title>Название страницы</title> </head> <body>
<h1>Заголовок статьи</h1> <p> Абзац статьи.</p> </body> </html>
<body bgcolor=?>
Устанавливает цвет фона документа, используя значение цвета в стандарте RGB -
пример: FFFF00 - желтый цвет.
<body text=?>
Устанавливает цвет текста документа, используя значение цвета в стандарте
RGB - пример: 00ff00 - зеленый цвет.<body link=?>Устанавливает цвет гиперссылок,
используя значение цвета в стандарте RGB - пример: 00FF00 - зеленый цвет.
<body vlink=?>
Устанавливает цвет гиперссылок, на которыхх вы уже побывали, используя
значение цвета в виде стандарте RGB - пример: 333333 - темно-серый цвет.
<body alink=?>
Устанавливает цвет гиперссылок при нажатии.
<pre></pre> Обрамляет предварительно отформатированный текст. (как
есть!)
<h1></h1> Создает САМЫЙ БОЛЬШОЙ заголовок (как отдельный абзац)
<h6></h6> Создает САМЫЙ МАЛЕНЬКИЙ заголовок
<b></b> Создает жирный текст
<i></i> Создает наклонный текст
<tt></tt> Создает текст - имитирующий стиль печатной машинки.
<cite></cite> Используется для цитат, обычно наклонный текст.
<em></em> Используется для выделения из текста слова (наклонный или
жирный текст)
<font size=?></font> Устанавливает размер текста в пределах от 1 до 7.
<font color=?></font> Устанавливает цвет текста, используя значение
цвета в виде RRGGBB.
<TITLE>Задание шрифта текста</TITLE><BODY><FONT face = "arial">
<FONT size = 1>
Самый маленький текст шрифта Arial<BR>
</FONT><FONT size = 3>
Обычный текст шрифта Arial<BR>
</FONT><FONT size = 7>
Самый большой текст шрифта Arial<BR>
</FONT></FONT><FONT face = "times new roman"><FONT size = 1>
Самый маленький текст шрифта Times New Roman<BR>
</FONT><FONT size = 3>
Обычный текст шрифта Times New Roman<BR>
</FONT><FONT size = 7>
Самый большой текст шрифта Times New Roman<BR>
</FONT>
</FONT>
</BODY>
<p>
Создает новый параграф
<blockquote></blockquote>
Создает отступы с обеих сторон текста.
<ol></ol>
Создает нумерованный список
<li>
Определяет каждый элемент списка и присваивает номер
<ul></ul>
Создает ненумерованный список
<li>
Предваряет каждый элемент списка и добавляет кружок или
квадратик.
ГИПЕРССЫЛКИ
<a href="URL">ТЕКСТ</a>Создает гиперссылку на другие документы или
часть текущего документа. Здесь URL адрес ссылки, ТЕКСТ - текст ссылки.
<a href="URL"> < img src="imgURL" > </a>Создает гиперссылку на рисунок,
находящийся по адресу imgURL.
"URL" = "links/main.htm"Адрес документа main.htm, находящегося в
локальной папке links данного компьютера.
"URL" = "http://www.rambler.ru"Ссылка на ресурс, находящийся на
удаленном компьютере. В адресе присутствуют: программа связи с
удаленным компьютером http (HyperText TransferProtocol, разделители :// и
интернет (IP) адрес искомого ресурса (в данном случае поискового
сервера Rambler).
<a href="mailto:EMAIL"></a>Создает гиперссылку вызова почтовой
программы для написания письма по указанному адресу.
<a name="NAME"></a>Отмечает часть текста как место перехода по
гипперссылке в документе.
<a href="#NAME"></a>Создает гиперссылку на помечанную часть текущего
документа.
Язык Html
Код в документе HTML
&#32;
&#33;
&#34;
&#35;
&#36;
&#37;
&#38;
&#60;
&#61;
&#62;
&#169;
&#171;
&#177;
&#185;
&#187;
&#197;
&nbsp;
&lt;
&gt;
&quot;
Выводится браузером на экран
пробел
!
"
#
$
%
&
<
=
>
©
«
±
¹
»
Å
Неразрывный пробел
<
>
"
Использование кодов символов и специальных знаков в документе
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.
<p><img src="/images/image.jpg"></p>
<table></table>
Создает таблицу.
Тег имеет следующие атрибуты:
border — ширина рамки;
width —ширина таблицы;
align – положение таблицы относительно боковых границ окна;
bgcolor — цвет фона под таблицей.
<tr></tr>
Определяет строку в таблице.
У этого тега есть следующие атрибуты:
аlign — выравнивание внутри строки:(LEFT, RIGHT, CENTER);
valign — вертикальное выравнивание(ТОР, BOTTOM, MIDDLE);
bgcolor — цвет фона внутри строки.
<td></td>
Определяет отдельную ячейку в таблице.
<th></th>
Определяет заголовок таблицы (нормальная ячейка с
отцентрованным жирным текстом)
<table border=#> Задает толщину рамки таблицы. (здесь 5)
<table cellspacing=#> Задает расстояние между ячейками таблицы.
<table cellpadding=#> Задает расстояние между содержимым ячейки
и ее рамкой.
<table width=#> Устанавливает ширину таблицы в пикселах или
процентах от ширины документа.
<tr align=?> или <td align=?>
Устанавливает выравнивание ячеек в таблице, принимает значения:
left, center, или right. (здесь right)
<tr valign=?> или <td valign=?>
Устанавливает вертикальное выравнивание для ячеек таблицы,
принимает значения : top, middle, или bottom.
<td colspan=#> Указывает кол-во столбцев которое объединено в
одной ячейке. (по умолчанию=1)
<td rowspan=#> Указывает кол-во строк которое объединено в одной
ячейке. (по умолчанию=1)
<td nowrap> Не позволяет программе просмотра делать перевод
строки в ячейке таблицы.
Пример создания таблицы:
→
Для форм, выполняющих какие-то функции должны быть запущены
соответствующие CGI скрипты на сервере. HTML создает только внешний
интерфейс формы.
<form></form>
Создает формы
<textarea name="NAME" cols=40 rows=8></textarea>
Создает окно для ввода текста. Columns указывает ширину
окна; rows указывает его высоту
<input type=text name="foo" size=20>
Создает строку для ввода текста. Параметром Size указывается
длина в символах.
<input type="submit" value="NAME">
Создает кнопку "Принять“
<input type="image" border=0 name="NAME" src="name.gif">
Создает кнопку "Принять" - для этого используется
изображение
<input type="reset">
Создает кнопку "Отмена"
<form name="forma1">
Введите пароль:<br>
<input type="password" name="text1" size="20"
maxlength="50">
</form>
Язык Html
Язык Html

More Related Content

What's hot (19)

PPT
Верстка_Лекция2
itc73
 
PPT
Web осень 2012 лекция 8
Technopark
 
PPT
Web весна 2013 лекция 8
Technopark
 
PPT
Present forms&css
itc73
 
PPT
Верстка_Лекция_3
itc73
 
PPT
Lection1
alexey1991
 
PDF
Как создать сайт
United Design
 
PPTX
Android Best Practices
Mad Devs
 
PPTX
Презентация на тему "WEB-программирование"
Gotti Vartanyan
 
PPT
Css part1
ISsoft
 
PPT
Css part2
ISsoft
 
PDF
Noveo web intership html5, css, interface
Noveo
 
PDF
Основы работы с таблицами стилей CSS
Denis Latushkin
 
PPT
Верстка_Лекция_1
itc73
 
PDF
Изучение HTML, CSS, PHP, MySQL
Alexandr Konfidentsialno
 
PPTX
HTML Tables
Olexandra Dmytrenko
 
Верстка_Лекция2
itc73
 
Web осень 2012 лекция 8
Technopark
 
Web весна 2013 лекция 8
Technopark
 
Present forms&css
itc73
 
Верстка_Лекция_3
itc73
 
Lection1
alexey1991
 
Как создать сайт
United Design
 
Android Best Practices
Mad Devs
 
Презентация на тему "WEB-программирование"
Gotti Vartanyan
 
Css part1
ISsoft
 
Css part2
ISsoft
 
Noveo web intership html5, css, interface
Noveo
 
Основы работы с таблицами стилей CSS
Denis Latushkin
 
Верстка_Лекция_1
itc73
 
Изучение HTML, CSS, PHP, MySQL
Alexandr Konfidentsialno
 
HTML Tables
Olexandra Dmytrenko
 

Similar to Язык Html (20)

PPT
основы нтмл
olgaoov
 
PPTX
Web конструирование на html
ANefyodova
 
PPT
Верстка_Лекция_1
itc73
 
PPT
Верстка_Лекция1
itc73
 
PPT
лекц14
Gulnaz Shakirova
 
PPTX
Тема 1. Введение в HTML
ssuser3896e2
 
PPT
Web страницы и web-сайты.структура web-страницы
Marina_stn
 
PPT
Html
zarechneva
 
PPT
dfvbfgbghbhg
Berrserker
 
PPS
основы языка Html
mmlllll
 
PPTX
Язык Html
Titenko1
 
PDF
Лекция #3. Введение в языки разметки web-страниц
Яковенко Кирилл
 
PPT
Html 0
Nadya159
 
PPT
Html 1 Урок
Nexa50
 
PPT
сысоев андрей
Vlado Sudin
 
PPT
сысоев андрей
Vlado Sudin
 
PPT
основы Html
Alexander Babich
 
PPTX
IT Center
Victor Salimgareev
 
основы нтмл
olgaoov
 
Web конструирование на html
ANefyodova
 
Верстка_Лекция_1
itc73
 
Верстка_Лекция1
itc73
 
лекц14
Gulnaz Shakirova
 
Тема 1. Введение в HTML
ssuser3896e2
 
Web страницы и web-сайты.структура web-страницы
Marina_stn
 
dfvbfgbghbhg
Berrserker
 
основы языка Html
mmlllll
 
Язык Html
Titenko1
 
Лекция #3. Введение в языки разметки web-страниц
Яковенко Кирилл
 
Html 0
Nadya159
 
Html 1 Урок
Nexa50
 
сысоев андрей
Vlado Sudin
 
сысоев андрей
Vlado Sudin
 
основы Html
Alexander Babich
 
Ad

More from Nick535 (20)

PDF
Структура операционных систем
Nick535
 
PDF
Cистемное программное обеспечение
Nick535
 
PDF
Оптические диски
Nick535
 
PDF
Внутренняя память компьютера
Nick535
 
PDF
Устройства вывода
Nick535
 
PDF
Устройства ввода
Nick535
 
PDF
Основные устройства персонального компьютера
Nick535
 
PPTX
Битва за Берлин
Nick535
 
PPT
Битва под Москвой.
Nick535
 
PPTX
Курская битва
Nick535
 
PPTX
Блокада Ленинграда
Nick535
 
PPTX
Вторая мировая война
Nick535
 
PPTX
советско финская война
Nick535
 
PPTX
Pervaya mirovaya voyna
Nick535
 
PPT
Личная гигиена
Nick535
 
PPTX
Эволюция экономической жизни
Nick535
 
PPT
Методы построения и анализа алгоритмов
Nick535
 
PPTX
Статистика
Nick535
 
PPTX
ОС в реальном времени
Nick535
 
PPTX
Правоохранительные органы Молдовы
Nick535
 
Структура операционных систем
Nick535
 
Cистемное программное обеспечение
Nick535
 
Оптические диски
Nick535
 
Внутренняя память компьютера
Nick535
 
Устройства вывода
Nick535
 
Устройства ввода
Nick535
 
Основные устройства персонального компьютера
Nick535
 
Битва за Берлин
Nick535
 
Битва под Москвой.
Nick535
 
Курская битва
Nick535
 
Блокада Ленинграда
Nick535
 
Вторая мировая война
Nick535
 
советско финская война
Nick535
 
Pervaya mirovaya voyna
Nick535
 
Личная гигиена
Nick535
 
Эволюция экономической жизни
Nick535
 
Методы построения и анализа алгоритмов
Nick535
 
Статистика
Nick535
 
ОС в реальном времени
Nick535
 
Правоохранительные органы Молдовы
Nick535
 
Ad

Язык Html

  • 2. HTML ( HyperText Markup Language — «язык гипертекстовой разметки») — стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц содержат описание разметки на языке HTML (или XHTML). Язык HTML интерпретируется браузерами; полученный в результате интерпретации форматированный текст отображается на экране монитора компьютера или мобильного устройства. Язык HTML является приложением SGML (стандартного обобщённого языка разметки) и соответствует международному стандарту ISO 8879. Язык XHTML является более строгим вариантом HTML, он следует всем ограничениям XML и, фактически, XHTML можно воспринимать как приложение языка XML к области разметки гипертекста. Во всемирной паутине HTML-страницы, как правило, передаются браузерам от сервера по протоколам HTTP или HTTPS, в виде простого текста или с использованием шифрования.
  • 3. Основные теги языка: <html></html> Указывает программе просмотра страниц, что это HTML документ. <head></head> Определяет место, где помещается различная информация не отображаемая в теле документа. Здесь располагается тег названия документа и теги для поисковых машин. <body></body> Определяет видимую часть документа <html> <head> <title>Название страницы</title> </head> <body> <h1>Заголовок статьи</h1> <p> Абзац статьи.</p> </body> </html>
  • 4. Теги оглавления: <title></title> Помещает название документа в оглавление программы просмотра страниц <html> <head> <title>Название страницы</title> </head> <body> <h1>Заголовок статьи</h1> <p> Абзац статьи.</p> </body> </html>
  • 5. <body bgcolor=?> Устанавливает цвет фона документа, используя значение цвета в стандарте RGB - пример: FFFF00 - желтый цвет. <body text=?> Устанавливает цвет текста документа, используя значение цвета в стандарте RGB - пример: 00ff00 - зеленый цвет.<body link=?>Устанавливает цвет гиперссылок, используя значение цвета в стандарте RGB - пример: 00FF00 - зеленый цвет. <body vlink=?> Устанавливает цвет гиперссылок, на которыхх вы уже побывали, используя значение цвета в виде стандарте RGB - пример: 333333 - темно-серый цвет. <body alink=?> Устанавливает цвет гиперссылок при нажатии.
  • 6. <pre></pre> Обрамляет предварительно отформатированный текст. (как есть!) <h1></h1> Создает САМЫЙ БОЛЬШОЙ заголовок (как отдельный абзац) <h6></h6> Создает САМЫЙ МАЛЕНЬКИЙ заголовок <b></b> Создает жирный текст <i></i> Создает наклонный текст <tt></tt> Создает текст - имитирующий стиль печатной машинки. <cite></cite> Используется для цитат, обычно наклонный текст. <em></em> Используется для выделения из текста слова (наклонный или жирный текст) <font size=?></font> Устанавливает размер текста в пределах от 1 до 7. <font color=?></font> Устанавливает цвет текста, используя значение цвета в виде RRGGBB.
  • 7. <TITLE>Задание шрифта текста</TITLE><BODY><FONT face = "arial"> <FONT size = 1> Самый маленький текст шрифта Arial<BR> </FONT><FONT size = 3> Обычный текст шрифта Arial<BR> </FONT><FONT size = 7> Самый большой текст шрифта Arial<BR> </FONT></FONT><FONT face = "times new roman"><FONT size = 1> Самый маленький текст шрифта Times New Roman<BR> </FONT><FONT size = 3> Обычный текст шрифта Times New Roman<BR> </FONT><FONT size = 7> Самый большой текст шрифта Times New Roman<BR> </FONT> </FONT> </BODY>
  • 8. <p> Создает новый параграф <blockquote></blockquote> Создает отступы с обеих сторон текста. <ol></ol> Создает нумерованный список <li> Определяет каждый элемент списка и присваивает номер <ul></ul> Создает ненумерованный список <li> Предваряет каждый элемент списка и добавляет кружок или квадратик.
  • 9. ГИПЕРССЫЛКИ <a href="URL">ТЕКСТ</a>Создает гиперссылку на другие документы или часть текущего документа. Здесь URL адрес ссылки, ТЕКСТ - текст ссылки. <a href="URL"> < img src="imgURL" > </a>Создает гиперссылку на рисунок, находящийся по адресу imgURL. "URL" = "links/main.htm"Адрес документа main.htm, находящегося в локальной папке links данного компьютера. "URL" = "http://www.rambler.ru"Ссылка на ресурс, находящийся на удаленном компьютере. В адресе присутствуют: программа связи с удаленным компьютером http (HyperText TransferProtocol, разделители :// и интернет (IP) адрес искомого ресурса (в данном случае поискового сервера Rambler). <a href="mailto:EMAIL"></a>Создает гиперссылку вызова почтовой программы для написания письма по указанному адресу. <a name="NAME"></a>Отмечает часть текста как место перехода по гипперссылке в документе. <a href="#NAME"></a>Создает гиперссылку на помечанную часть текущего документа.
  • 11. Код в документе HTML &#32; &#33; &#34; &#35; &#36; &#37; &#38; &#60; &#61; &#62; &#169; &#171; &#177; &#185; &#187; &#197; &nbsp; &lt; &gt; &quot; Выводится браузером на экран пробел ! " # $ % & < = > © « ± ¹ » Å Неразрывный пробел < > " Использование кодов символов и специальных знаков в документе HTML
  • 12. <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.
  • 14. <table></table> Создает таблицу. Тег имеет следующие атрибуты: border — ширина рамки; width —ширина таблицы; align – положение таблицы относительно боковых границ окна; bgcolor — цвет фона под таблицей. <tr></tr> Определяет строку в таблице. У этого тега есть следующие атрибуты: аlign — выравнивание внутри строки:(LEFT, RIGHT, CENTER); valign — вертикальное выравнивание(ТОР, BOTTOM, MIDDLE); bgcolor — цвет фона внутри строки. <td></td> Определяет отдельную ячейку в таблице. <th></th> Определяет заголовок таблицы (нормальная ячейка с отцентрованным жирным текстом)
  • 15. <table border=#> Задает толщину рамки таблицы. (здесь 5) <table cellspacing=#> Задает расстояние между ячейками таблицы. <table cellpadding=#> Задает расстояние между содержимым ячейки и ее рамкой. <table width=#> Устанавливает ширину таблицы в пикселах или процентах от ширины документа. <tr align=?> или <td align=?> Устанавливает выравнивание ячеек в таблице, принимает значения: left, center, или right. (здесь right) <tr valign=?> или <td valign=?> Устанавливает вертикальное выравнивание для ячеек таблицы, принимает значения : top, middle, или bottom. <td colspan=#> Указывает кол-во столбцев которое объединено в одной ячейке. (по умолчанию=1) <td rowspan=#> Указывает кол-во строк которое объединено в одной ячейке. (по умолчанию=1) <td nowrap> Не позволяет программе просмотра делать перевод строки в ячейке таблицы.
  • 17. Для форм, выполняющих какие-то функции должны быть запущены соответствующие CGI скрипты на сервере. HTML создает только внешний интерфейс формы. <form></form> Создает формы <textarea name="NAME" cols=40 rows=8></textarea> Создает окно для ввода текста. Columns указывает ширину окна; rows указывает его высоту <input type=text name="foo" size=20> Создает строку для ввода текста. Параметром Size указывается длина в символах. <input type="submit" value="NAME"> Создает кнопку "Принять“ <input type="image" border=0 name="NAME" src="name.gif"> Создает кнопку "Принять" - для этого используется изображение <input type="reset"> Создает кнопку "Отмена"
  • 18. <form name="forma1"> Введите пароль:<br> <input type="password" name="text1" size="20" maxlength="50"> </form>