Ещё немного основ и скоро будем переходить к дизайну (изучать CSS и сетку фреймворка Bootstrap) Сегодня хочу поговорить об атрибутах html-тегов <p class="first-attribute">Первый параграф</p> В примере сверху был использован тег <p>, ну а как вы поняли, атрибутом тут является class="...", прямо так и говорится: Тэг <p> имеет атрибут class Обычно атрибуты применяются для создания ссылок, дизайна, присвоения имён тегам Приведу примеры нескольких тегов с атрибутами: <a href="yandex.ru">Ссылка, которая перенаправляет на сайт Яндекса</a>(вместо yandex.ru может быть любой другой адрес). href - атрибут <p class="my_style">Параграф</p> <p id="my_style_1">Еще один параграф</p У двух тегов выше есть атрибуты class и id соответственно, они используются для дизайна страницы с помощью CSS (Об этом поговорим позже) Забыл сказать, что у html-тегов может быть бесконечное количество атрибутов: <a class="my_style" href="google.com"></a> - разные атрибуты разделяются пробелами. В принципе это основная информация об атрибутах. Для знания основ большего не надо. Предлагаю теперь перейти к еще нескольким html-тегам, которые будут нам полезны в дальнейшем: <img src="/img/test.jpg" alt="Горы"> - используется для прикрепления изображения на сайт. src - атрибут, в котором указывается путь к картинке (если вы создаете страницу на локальном компьютере, то корневой папкой для картинки будет та папка, в которой лежит ваш html-файл. Например ваша картинка называется test.jpg и вы положили её в ту же папку что и html файл, тогда src="/test.jpg") alt - Текст, который будет отображаться в том случае, если по каким-то причинам картинка не отобразится Тэги div и span: Тэг div никак не влияет на то, что видит пользователь, но несмотря на это он выполняет важную функцию для дизайна сайта. Зайдите на сайт любого интернет магазина и как обычно вы увидите вверху меню, чуть ниже блок с товарами, еще ниже блок с контактами, возможно слева будет меню товаров, а справа какая-нибудь информация о скидках. Так вот, как же нам разделить нашу страницу на такие логические блоки? Тут на помощь приходят тэги div и span Всё что вы заключите между тегами <div> и </div> будет выделено отдельным блоком, к которому вы можете применить стили. Таким образом можно выделить меню, блок с новостями и т.д. и применить к ним абсолютно разный дизайн. (Где-то сделать вытянутую полоску, где-то изменить цвет фона и так далее) Тэг <span> несёт точно такую же функцию как и <div>, но отличается в отображении на странице: <div>Первый блок</div> <div>Второй блок</div> <div>Третий блок</div> - если вы поместите на свою страницу такие три блока, то они будут располагаться один под другим. <span>Первый блок</span> <span>Второй блок</span> <span>Третий блок</span> - такие три блока будут располагаться на одной строке. Вот и всё отличие) Тэги <br> и <hr> (не требуют закрывающего тега): Допустим вы решили вставить на вашу страницу текст сплошняком и вам понадобилось где-то сделать перенос на новую строку. Именно в этом месте и надо поставить тэг <br> Тэг <hr> также отвечает за переход на новую строку, но еще и рисует горизонтальную линию во всю ширину текущего блока между строками, которые вы перенесли. Для субботнего урока думаю достаточно. Советую вам попрактиковаться с этими тегами. Попробуйте разные сочетания, покрутите их между собой. Сделайте простенький блог со статьями на html. Спасибо, с вами всегда был ваш - SmileyCoder :3