Step 4 (S-44724)

Step on Stepik: https://stepik.org/lesson/14820/step/4

[00:00 - 00:17] какие теги могут находиться внутри body а вообще довольно большое количество и выглядят они весьма по разному в 1 приближении можно разделить на блочной и строчные теги а

[00:17 - 00:35] примерами вложенных тегов являются следующие теги аш 1 аш дважды аш 4 аш 5 о 6 это заголовки различных уровней а ведут они себя совершенно логично заголовком в любом текстовом редакторе например в ворд

[00:35 - 00:50] чем меньше число ты стаж 1 это самый крупный заголовок а 6 самый маленький заголовок тег п это разбиение текста параграфа а как правило у каждого параграфа есть

[00:50 - 01:07] отступ 1 строчкой а то есть так называемая красная строка и некоторые отступа снизу а аш и ф горизонтальная линия горизонта

[01:07 - 01:23] а просто горизонтальная линия для отбивки текста в пример этот блог форматированного а при форматировании текста например исходного кода а зачем зачем это он так нужен

[01:23 - 01:38] дело в том что мы ходим а пробелы в тексте они несущественны то есть парсер а убирает пробелы а считает что

[01:38 - 01:56] независимо от того был там несколько пробелов либо перенос строк все это схватывается до 1 пробелы и пробелы в тексте расставляются автоматически в зависимости от имеющейся ширины а не пробелы переносы строк вставляется автоматически а для

[01:56 - 02:13] художественных текстов так скажем для обычных текста в это нормальное поведение но если вы пытаетесь вывести например а какой то фрагмент кода сниппет естественно что вы хотите самостоятельно управлять переносами строк потому что это важно

[02:13 - 02:28] а в таком случае используется блок внутри внутри тегов при переносе форматировании сохраняется кроме того как правило используется моноширинный а шрифт

[02:28 - 02:43] поэтому вы видите структура программного блок применяется для цитирования для вывода цитаты а и наконец

[02:43 - 03:01] где это абстрактное абстрактным блочный контейнер а что значит абстрактно что это значит что браузер никоим образом визуально не отображается содержимое показывать

[03:01 - 03:20] от того что какой то содержимое документе завернуто в тег div оно взяли никак не меняется можно завернуть в 1 ты где их можно в 10 выглядеть будет одинаково а такие теги они используются для задания структуры то есть если вам нужно сгруппировать какое то

[03:20 - 03:39] содержимое моей документе вы можете использовать тэг div а позже вы сможете к этому тегу обратиться с помощью его идентификатора либо с помощью имени класс если вы зададите для данного так а как здесь просто приведем пример

[03:39 - 03:56] а верстки с использованием вложенных тегов опцию презентация досталось а вы что мы соответственно самопрезентации является примером примером использования блочных так вот здесь например так аш 2 использован

[03:56 - 04:15] втэк аш 2 есть некоторые отступ после него ответить отступ после текста здесь тоже так аш 2 тоже отступ есть это то что мы говорили про семантику 2 есть семантика это заголовок есть определенные

[04:15 - 04:35] оформление по умолчанию это крупный шрифт как мы видим и отступ отступ по тэгам а вот здесь использовано 2 только параграф 1 параграф 2 параграф после параграфа так же есть некоторые отступ

[04:35 - 04:52] параграфа должна быть красная строка и за стили которые применяются в данной презентации этой красной строки не видно то есть вы видите что они в 1 вертикали а что говорит о том что

[04:52 - 05:09] есть стили по умолчанию в браузере а есть те которые дополнительно накладывает оформления конкретно конкретного в страниц а в чем особенность в чем особенность блочных тэс почему их называют блочной

[05:09 - 05:28] особенно сборочных цехов заключается в том а что они занимают всю предоставленную ширину то есть а браузер предоставляется при отрисовке ширина она как раз таки

[05:28 - 05:48] максимально возможно а это 1 особенность представляет всю возможную ширину 2 особенность заключается в том что блочные а теги всегда начинаются с новой строки

[05:48 - 06:03] даже если вы что мы коде они написаны в 1 большую стойкость весь файл в 1 строчку а обычные теги будут начинаться каждый с новой строки 1 тег

[06:03 - 06:20] 2 тег 3 4 а вот таким образом работает

[06:20 - 06:37] в противовес блочном есть срочное либо так называемой онлайн теги а их довольно много не более и не более такие известные примеры это гиперссылки

[06:37 - 06:52] а про нем поговорим подробнее а ты где е это акцентирование за метались то есть наклоны наклоны а выделение жирным

[06:52 - 07:12] работа одинаковая то просто старый новый стандарт отличается вставка изображения если вы вставляете с помощью in msg изображение оно будет находиться внутри строки а верхний нижний индекс

[07:12 - 07:28] и абстрактные строчные контейнер а по аналогии сделал а абстрактно заключается в том что визуально он никак себя не проявляет то есть используется исключительно для выделения content а в чем

[07:28 - 07:45] в чем заключается поведения срочных так а поведение срочно тегов оно противоположно поведению блочно а если блочные а теги занимают 100% предоставлен шины строчные

[07:45 - 08:04] а стараются занимать минимально возможную ширину то есть они как бы оборачиваются вокруг слово контента которые внутри них находятся внутри слов которые в них находится строчные тебя не понимают минимально возможную ширину и они не прерывают строчку то есть вот так

[08:04 - 08:22] поток слов вошел в строке так он продолжает идти строчные t get эквиваленты ну фактически был которые возникают строки а еще 1 отличие между строчными блочно метелями а возможности задать размер

[08:22 - 08:40] а размеры срочно стеков считается автоматически по их содержимое соответственно задать размер нельзя для блочного только вы можете указать например явно ширину с помощью специального стиля и блочный так вас станет короче

[08:40 - 08:58] а для срочных тегов такое невозможно деление на строчные и больше интриги оно а весьма условна а позже при а сейчас я объясню почему нет а

[08:58 - 09:15] вот здесь пример времен это срочно так то есть он находится в строке а при а не прерывает размер строки он не старается занять возможно место но тем не менее у него можно указывать ширину и высоту

[09:15 - 09:24] то есть это такой промежуточный так на самом деле а если вот так испании высоту ширину указывать нельзя то у тэга img можно