Создание сайтов - путь к мечте ч.3
Тег <body> и контент нашего сайта
Продолжим разбирать теги:
Тег <body></body> это парный тег. После этого тега находится контент сайта и большинство тегов находятся именно здесь. Будем разбирать все по порядку и максимально подробно.
Тег <header></header> парный тег. Можно добавить список (в виде меню) или добавить текст.
Внутри этого тега находится заголовок страницы.
Пример: http://codepen.io/Alexcoul/pen/xVJNxo/ (это ссылка на онлайн редактор, где вы можете посмотреть как отображается код в мини браузере и даже написать что-то сами так как в редакторе "пикабу" правильно код не отобразится)
<body>
<header>
<h1>Персональный сайт</h1>
</header>
<article>
<h2>Добро пожаловать!</h2>
<p>Рад приветствовать вас на нашем сайте.</p>
</article>
</body>
Теги <h1>,<h2>, <h3>, <h4>, <h5>, <h6> теги парные </>.
Эти теги задают заголовок шести уровней. Начиная от первого до шестого они отличаются самое главное по значимости и по размеру.
Пример: что бы увидеть это наглядно (здесь мы этого не увидим) :
Ссылка на онлайн редактор
Тег <article> парный тег </>.
Этот тег задает содержание страницы (новость, пост, статья, запись блога).
Тег <p> парный тег </>.
После этого тега пишется текст который начинается с нового абзаца. Добавленные абзацы которые следуют друг за другом разделяются между собой отбивкой.
Пример: http://codepen.io/Alexcoul/pen/WwKBxz
<body>
<header>
<h1>Сделать сайт самому</h1>
</header>
<article>
<p>Для начала нужно<br> выучить разметку HTML5,<br> а потом приступить к CSS3.</p>
<p>Так же неплохобы выучить динамику сайта,<br> базу даных. Не так просто как кажется,<br> но мы не стоим на месте.</p>
</article>
</body>
Тег <span> парный тег </>.
Этот тег можно применять внутри других тегов и применять для выделенного элемента свои стили. (чуть коснемся CSS для примера).
Пример: http://codepen.io/Alexcoul/pen/PNBvbK
В примере мы видим что весь текст выделен синим цветом, а слова внутри тега <span> красным.
Тег <br> одиночный тег.
Этот тег служить для переноса текста на новую строку. Видно в примерах выше.
Тег <hr> одиночный тег.
Создают горизонтальную линию. Атрибутами задаются: ширина, толщина, цвет и выравнивание.
Тег <strong> парный тег </>.
Этот тег выделяет текст жирным и предает ему важность со стороны браузера. По сравнению с тегом <b> который тоже выделяет текст, но только визуально. Никакой важности тег <b> не несет.
Тег <em> парный тег </>.
Этот тег делает текст курсивом и делает на нем особый акцент. А тег <i> который делает тоже самое, не имеет особой важности.
Пожалуй этого поста хватит, далее идем дальше по тегам и строим таблицу.
Учимся применять их в онлайн редакторе (естественно кто хочет).
Спасибо большое за внимание и за критику, а так же новым подписчикам ждите все будет.
