Привет, джуниор!
В прошлой статье, мы поговорили о базой разметке html-страницы. Пора углубится в изучении тегов и наполнить нашу страницу контентом.
Заголовки страниц
Заголовки страниц создаются с помощью тегов:
<h1> - заголовок первого уровня;
<h2> - заголовок второго уровня;
<h3> - заголовок третьего уровня;
<h4> - заголовок четвертого уровня;
<h5> - заголовок пятого уровня;
<h6> - заголовок шестого уровня;
Отредактируйте код и обновите страницу
Как вы могли заметить, все заголовки имеют жирный текст и разный размер.
Абзацы
Основным элементом для веб-страницы являются абзацы. Используя тег <p> - мы можем добавить абзац. Отредактируйте код и обновите страницу.
Ссылки
Чтобы добавить ссылки на внешний источник (сайт) или выполнить переход между страницами сайта, необходимо использовать тег <a>.
У ссылок есть обязательный атрибут href, используя этот атрибут, мы указываем странице адрес, куда мы хотим перейти. Отредактируйте код и обновите страницу.
Изображение
Для добавления изображения на страницу необходимо воспользоваться тегом <img>. Тег содержит два атрибута src и alt.
В значение атрибута src задают путь до картинки в папке проекта или url-адрес изображения из интернета.
В значение атрибута alt задают имя для изображения, на тот случай, когда браузер не может отобразить саму картинку.
Для наглядности примера, скопируйте url любой картинки из интернета и поместите в значения атрибута src.
Отредактируйте код и обновите страницу.
Обратите внимание, тег img является самозакрывающимся.
Списки
Для создания списков в html используется несколько тегов:
<ul> - создает маркированный список.
<ol> - создает нумерованный список.
Тег <li> в обоих случаях, служит для создания элементов внутри списка.
Отредактируйте код и обновите страницу.
Сегодня мы изучили лишь малую часть различных тегов, которые используются при создании веб-страницы.
В следующей статье, познакомимся с CSS, что позволить нам визуально изменять нашу страницу.
До скорых встреч =)