Подробнее об элементах в head-секции HTML документа



HTML <meta> Теги

Описание документа
Ключевые слова документа
Перенаправление пользователя

Подробнее о метатегах HTML

HTML Скрипты

Вставка скрипта
Использование тега <noscript>

Подробнее об использовании скриптов в HTML

 

 

Пример
<html> <body> </body> </html>


Попробуйте сами »
Щелкните на кнопке "Попробуйте сами" чтобы увидеть как это работает

Что такое HTML?

HTML это язык для описания веб страниц

  • HTML - это аббревиатура от Hyper Text Markup Language (Язык гипертекстовой разметки)
  • HTML это не язык программирования, это язык разметки
  • Язык разметки - это набортегов разметки
  • HTML использует теги разметки для описания веб страниц

HTML Тэги

HTML-тэги разметки обычно называют HTML тэгами

  • HTML тэги - это ключевые слова, окруженные угловыми скобками, например <html>
  • HTML тэги обычно идут парами, например <b> and </b>
  • Первый тэг в паре называется стартовым тэгом, второй тэг - конечным
  • Стартовый и конечный тэги также называют открывающим изакрывающим тэгами

HTML Документы = Веб Страницы

  • HTML документы описывают веб страницы
  • HTML документы содержат HTML тэги и обычный текс
  • HTML документы также называются веб страницами

Цель веб браузера (наподобие Internet Explorer или Firefox) - читать HTML документы и отображать их как веб страницы. Браузер не отображает HTML тэги, но использует тэги для интерпретации содержимого страницы:

<html> <body> </body> </html>

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

  • Текст между <html> и </html> описывает веб страницу
  • Текст между <body> и </body> это видимое содержание таблицы
  • Текст между <h1> и </h1> отображается как заголовок
  • Текст между <p> и </p> отображается как параграф

HTML Урок 3 Создаем Первую Веб Страницу !

То вам потребуется

На уроках HTML Вам не нужны какие-либо инструменты для изучения.

  • Вам не потребуется HTML редактор
  • Вам не нужен Веб сервер
  • Нет необходимости в уже работающем Веб сайте

Редактирование HTML

HTML можно вводить и редактировать в различных редакторах типа Dreamweaver и Visual Studio.

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

Создайте Свою Собственную Тестовую Страницу

Если вы просто хотите изучить HTML, пропустите оставшуюся часть главы.

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

(Кликните правой кнопкой мыши на каждой ссылке, и выберите "сохранить как" или "сохранить по ссылке как")

mainpage.htm

page1.htm

page2.htm

После того как вы скопировали файлы, вы можете двойным щелчком кликнуть на файле по названием "mainpage.htm", чтобы увидеть ваш первый веб сайт в действии.

Используйте Вашу Тестовую Страницу Для Изучения

Мы советуем вам экспериментировать со всем, что вы изучаете на уроках HTML, путем редактирования ваших веб файлов в текстовом редакторе (наподобие Блокнота Windows).

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

Какое расширение файла использовать : .HTM или .HTML ?

Когда вы сохраняете HTML-файл, вы можете использовать расширение файла .htm или .html. Нет никакой разницы - это всецело на ваше усмотрение.

HTML Заголовки

HTML заголовки определяются с помощью тэгов <h1> - <h6>.

Пример


Попробуйте сами »
Щелкните на кнопке "Попробуйте сами" чтобы увидеть как это работает

 

HTML Параграфы

HTML параграфы определяются с помощью тэга <p>.

Пример
 


Попробуйте сами »
Щелкните на кнопке "Попробуйте сами" чтобы увидеть как это работает

 

HTML Ссылки

HTML ссылки определяются с помощью тэга <a>.

Пример
 


Попробуйте сами »
Щелкните на кнопке "Попробуйте сами" чтобы увидеть как это работает

Примечание: Адрес ссылки указывается в атрибуте href.

(Вы узнаете об атрибутах далее в наших Уроках HTML)

HTML Изображения

HTML изображения определяются с помощью тэга <img>.

Пример
<img src="web.jpg" height="214" />


Попробуйте сами »
Щелкните на кнопке "Попробуйте сами" чтобы увидеть как это работает

Примечание: Название и размер изображения указываются в атрибутах.

HTML Элементы

HTML элемент - это все, что находится между открывающим и закрывающим тегами:

Начальный тег * Содержимое элемента Конечный тег *
<p> Это параграф </p>
<a href="default.php" > Это ссылка </a>
<br />    

* Начальный тег часто называют открывающим тегом. Конечный тег часто называют закрывающим тегом.

HTML Синтаксис Элемента

  • HTML элемент начинается с начального / открывающего тега
  • HTML элемент заканчивается конечным / закрывающим тегом
  • Содержимое элемента всегда находится между начальным и конечным тегами
  • Некоторые HTML элементы имеют пустое содержимое
  • Пустые элементы закрываются в начальном теге
  • Большинство HTML элементов могут иметь аттрибуты

Подсказка: Вы узнаете об аттрибутах в следующем Уроке HTML данного учебного курса.

Вложенные HTML Элементы

Большинство HTML элементов могут быть вложенными (могут содержать другие HTML элементы).

HTML документы состоят из вложенных HTML элементов.

HTML Документ Пример

<html> <body> <p>Это мой первый параграф.</p> </body> </html>

Этот пример выше содержит 3 HTML элемента.

HTML Разбор Примера

<p> элемент:

<p>Это мой первый параграф.</p>

<p> элемент определяет параграф в HTML документе.
Этот элемент имеет гачальный тег <p> и конечный тег </p>.
Содержимое элемента : Это мой первый параграф.

<body> элемент:

<body> <p>Это мой первый параграф.</p> </body>

<body> элемент определяет тело HTML.
Элемент имеет начальный тег <body> и конечный тег </body>.
Содержимое элемента - другой HTML элемент (p).

<html> элемент:

<html> <body> <p>Это мой первый параграф.</p> </body> </html>

<html> элемент определяет целый HTML документ.
Элемент имеет начальный тег <html> и конечный тег </html>.
Содержимое элемента - другой HTML элемент (body).


Дата добавления: 2019-01-14; просмотров: 242; Мы поможем в написании вашей работы!

Поделиться с друзьями:






Мы поможем в написании ваших работ!