Отправляет email-рассылки с помощью сервиса Sendsay

Уроки Web-программирования

Подписаться Бесплатная «Серебряная» новостная рассылка . Подписчиков 77 RSS
  Март 2016   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31


За последние 60 дней ни разу не выходила


Открыта: 16-03-2016

Автор
alex@sankus.ru

Статистика

77 подписчиков
0 за неделю
←   Все выпуски   →

Уроки Web-программирования Введение в язык разметки HTML


Что такое HTML?

HTML - это язык разметки, предназначенный для описания веб-документов (веб-страниц).

  • HTML расшифровывается как Hyper Text Markup Language (язык разметки гипертекста)
  • язык разметки состоит из тегов разметки
  • HTML документы описываются HTML тегами
  • Каждый HTML тэг описывает разные части документа

Пример HTML документа

 

небольшой HTML документ:

<!DOCTYPE html>
<html>
<head>
<title>заголовок страницы</title>
</head>
<body>

<h1>Мой первый заголовок</h1>
<p>Мой первый параграф.</p>

</body>
</html>

 Разбор примера

  • Объявление DOCTYPE определяет, что  документ является документом HTML
  • Текст между тегами <html> и </html> описывает весь HTML документ
  • Текст между тегами <head> и </head> хранит информация о самом документе
  • Текст между тегами <title> и </title> хранит заголовок документа
  • Текст между тегами <body> и </body> описывает видимую часть документа
  • Текст между тегами <h1> и </h1> описывает заголовок в тексте
  • Текст между тегами <p> и </p> описывает параграф

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

HTML теги

HTML теги - это ключевые слова (наименования тегов) окруженые угловыми скобками:

<тег>какой-то контент</тег>
  • HTML теги обычно идут парами например <p> и </p>
  • Первый тег в паре называется начальный тег, второй - конечный тег
  • Конечный тег пишется также как и начальный, но со слешем перед именем тега
NoteНачальный тег часто называют открывающим тегом. Соответственно, конечный - закрывающим тегом.

Web браузеры

Цель любого браузера (Chrome, IE, Firefox, Safari)  - это считать HTML документ и отобразить его.

Браузер не отображает HTML теги, но использует их для определения того, как отобразить документ:

View in Browser

Структура HTML страницы 

Ниже визуализирована структура HTML страницы:

<html>
<head>
<title>Заголовок страницы</title>
</head>
<body>
<h1>Заголовок текста</h1>
<p>Параграф текста.</p>
<p>Другой параграф текста.</p>
</body>
</html>
NoteВ браузере отображается только то что находиться в зоне действия тега <body> (белое пространство).

<!DOCTYPE> указание

<!DOCTYPE> указание помогает браузеру корректно отображать содержимое страницы

TСуществует много видов документов с сети.

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

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

<!DOCTYPE html>

<!DOCTYPE HTML>

<!doctype html>

<!Doctype Html>

Основные объявления вебдокументов

HTML5

<!DOCTYPE html>

HTML 4.01

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

XHTML 1.0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
В избранное