Урок HTML для начинающих. Урок третий

В прошлой статье «html для начинающих» я говорил об том, что такое HTML, из каких элементов состоит его основная структура и о правилах записи тегов, также мы выяснили, что лучше всего придерживаться какого то стиля написания кода. Об этом я говорил в статье «оформление кода»

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

Завтра будет последний урок из этой серии, поэтому не пропустите его! Подписывайтесь на обновления по E-mail! И будьте в курсе всего, что происходит на блоге!

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

По ходу изучения HTML я буду приводить спецификацию тегов: является элемент блочным или строчным, парным или одиночным, приведу необходимые атрибуты этого тега и т.д.
Итак, приступим!

Давайте вернемся к книгам. Как вы знаете, любая книга начинается с заголовка. Именно с заголовка мы и начнем уроки языка html.

HTML заголовок определяется тегами <h1></h1> и по нисходящей линии важности до <h6></h6>. Тег <h1></h1> наиболее важный элемент, чем <h6></h6>. Этот элемент менее важен, поэтому используется очень редко.

Создайте любой документ HTML и впишите в него следующий код, чтобы понять, как работают заголовки:

Теги заголовков от 1 до 6 уровня важности: <h1></h1> ... <h6></h6>. Они являются блочными и могут содержать только строчные элементы. Теги заголовка не могут содержать блочных элементов.

Например, тег <h1></h1> не может содержать в себе другой тег заголовка. Следующая запись недопустима!:

Такая запись будет распознана, как ошибка! Это нужно запомнить!

Теперь создадим новый файл в кодировке UTF-8, в котором запишем основную структуру документа и уже между тегом <body></body> мы поместим наш первый заголовок:

Сохраните файл и запустите его. Должно получиться что-то подобное:

Тег h1 уроки html для начинающих

Что видно на данном изображении? Заголовок выровнен по левому краю, прижат к самому верху, в заголовке окна и в заголовке закладки браузера написан текст, который содержится между тегами <title></title>.

Заголовок, может быть выровнен не только по левому краю. Он может быть выровнен по правому краю или центру. Такое расположение определяет специальный атрибут.

Таких атрибутов для HTML заголовка различного уровня, от <h1></h1> до<h6></h6> существует много. Давайте рассмотрим самые основные, которые мы будем использовать на протяжении всех уроков.

  • id, class – это идентификаторы, которые используются в пределах одного документа, т.е. одной страницы. Для чего они нужны я расскажу в других уроках html для начинающих, когда коснемся якорей (тип ссылки) и каскадных таблиц стилей
  • style – внедряет стилевые свойства, прописанные напрямую в сам тег, не ссылаясь на свойства в подключенном файле стилей
  • align – определяет выравнивание

Давайте посмотрим, как будет вести себя элемент <h1></h1> при различном выравнивании:

Я использовал три одинаковых элемента с разным позиционированием: один элемент прижат к левому краю, второй к правому и третий выровнен по центру. Такой пример я сделал для наглядности. Такое использование заголовков не рекомендовано.

Хочу сделать небольшое замечание: использовать элемент <h1></h1> на странице рекомендуется только 1 раз. Не рекомендуется использовать этот элемент два или более раз подряд на одной странице. Лучше, чтобы вторым заголовком был не элемент <h1></h1>, а допустим элемент <h2></h2>.

Не допускайте ошибок и не перепрыгивайте через порядок нумерации заголовков. Следующая запись недопустима!:

Все должно идти по-порядку! Если используете несколько заголовков на одной странице, то лучше использовать один тег html заголовка <h1></h1> и остальные сделать заголовками <h2></h2>:

Итак, подведем итоги. Из этой статьи вы узнали:

  • оформление текста благоприятно влияет на процесс создания web-страницы
  • существует шесть типов заголовков от <h1></h1> до <h6></h6>
  • тег <h1></h1> является наиболее важным на странице и поэтому его лучше использовать всего один раз в пределах одного документа
  • узнали про порядок использования тегов заголовка
  • познакомились с атрибутами этого тега
  • научились выравнивать тег заголовка.

P.S. Ну что, понравилась статья? Дальше будет только интереснее! Поэтому смело подписывайтесь на мои обновления блога и будьте в курсе происходящего! Вас ждут интересные и полезные статьи, конкурсы, опросы и много чего интересного! Также можете порекомендовать мои уроки своим друзьям в социальных сетях, кликнув по иконкам социальных сетей, чуть ниже этого сообщения.

Понравилась статья? Поделитесь с друзьями!

0


This Post Has Been Viewed 2 Times

Автор статьи: , дата публикации

Читайте также на моем блоге:

  • Зачем нужен хостинг для сайта
  • Какой хостинг выбрать: платный или бесплатный?
  • Как выбрать хороший хостинг для сайта
  • Выбираем дешевый и качественный хостинг!
  • Конструктор сайтов Юкоз — обзор возможностей
  • Ucoz — создать сайт стало проще!
  • Перед тем как создать блог или сайт
  • Секреты размещения сайта в интернете! Разбираемся, что к чему!
  • Научиться создавать сайты очень просто! Бесплатно! Самому! Сейчас!
  • Программы необходимые каждому блогеру
К этой записи читатели еще не оставили комментариев! Будьте первым!
Добавить комментарий к этой статье:

(обязательно)

(не будет опубликовано, обязательно)

Вебсайт (если есть)

  • Получайте оповещения о выходе новых статей на Ваш E-mail. Для этого, введите Ваш E-mail и нажмите Enter.

  • Рубрики

  • Присоединяйся ко мне!

    Группа
    Вконтакте

    Канал на
    You Tube

    Я на
    Twitter