• О сайте
  • CSS
  • HTML
  • Об HTML
  • Памятка тегов
  • Урок по HTML

Урок по HTML

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

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

Подготовка документа

Код должен начинаться с <!DOCTYPE html>. Это сообщает браузеру, что используется язык HTML.

Следующие теги - <html> и </html> - открывают и закрывают документ соответственно.

Заголовок и тело страницы

Документ состоит из двух частей - заголовка страницы (<head>) и её тела (<body>). В заголовке располагается информация о странице, а в теле - её содержимое.

В заглавии располагается элемент <title>, содержащий название страницы (показывается в заголовке окна браузера). Давайте добавим нашему сайту название.

Параграфы и изображения

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


Картинки добавляются посредством элемента <img>. Обратите внимание: это один из пустых элементов, то есть он ничего в себе не содержит. Адрес нужного изображения задаётся с помощью атрибута src. Атрибуты служат для определения свойств элементов и указываются в открывающем теге. Если атрибутов несколько, порядок их перечисления неважен.


Заголовки и гиперссылки

Для добавления заголовка служат элементы <h1>-<h6> (1 - самый большой размер текста, 6 - самый маленький).


Теперь добавим на сайт гиперссылку. Гиперссылки могут указывать куда угодно - на определённый элемент данной страницы или на другую страницу. Адрес перехода указывается в атрибуте href элемента <a>.


Списки и контейнер <div>

Ещё один важный элемент - списки. Хотя для их создания и можно воспользоваться элементами <p>, это противоречит идее использования HTML в целях указания структуры документа, поэтому для списков существует отдельный элемент. Списки могут быть упорядоченными - тег <ol> и неупорядоченными - тег <ul>. Каждый отдельный пункт списка заключается в элемент <li>.


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

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

Сайт ФПМиКТ
Besucherzahler rusian brides
счетчик посещений