В этом видео я расскажу вам про элементы, группирующие своё содержимое. Итак, элементы, группирующие своё содержимое, это элементы, которые логически объединяют в некоторые группы своё содержимое. Например, элемент <main> — он указывает на главное содержимое всей страницы. На этом элементе мнение спецификаций W3C и WHATWG расходятся. W3C считает, что элемент должен быть один на странице, поскольку главное содержимое одно. А компания WHATWG считает, что этих элементов может быть сколь угодно много на странице. Элемент <p> определяет параграф текста. То есть он объединяет текст, находящийся внутри, в параграф. Например, у нас есть некоторый текст, и его нужно разбить на параграфы. Мы этот кусок текста можем заключить в элемент <p>. У этого элемента есть одна особенность. Если мы вложим внутрь одного параграфа другой параграф, то предыдущий параграф закроется перед тем, как начнётся следующий. И вот так это выглядит в браузере. То есть по умолчанию добавляются отступы сверху и снизу у параграфов. Элемент <hr> позволяет создавать горизонтальную линию для тематического разделения параграфов. Например, у нас есть большой кусок текста, и мы его заключаем в элемент <p>. И когда у нас заканчивается тема, мы можем добавить элемент <hr> для того чтобы указать, что здесь заканчивается тема, и дальше начинается новая. В браузере это выглядит вот так. То есть при добавлении элемента <hr> браузер нарисует горизонтальную линию. Но не стоит использовать элемент <hr>, если он не несёт того смысла, для которого он создан, вставлять для того, чтобы нарисовать просто горизонтальную линию. Что будет, если мы в обычный элемент, например, <p> добавим текст в вот такой красивой ASCII-графике, то есть содержит много пробелов, переносов, и получился вот такой красивый текст. Будет вот такая штуковина. То есть все пробелы схлопнулись, все переносы схлопнулись, и текст выстроился в одну линию. Чтобы этого избежать, можно воспользоваться элементом <pre> — preformatted text, и в этом случае браузер не будет «схлопывать» все переносы, а отобразит его так, как вы его разметили при помощи переносов и пробелов. Ну в браузере выглядит так, как ожидается. Элемент <blockquote> предназначен для создания длинных цитат внутри документа. Например, у нас есть цитата Джона Леннона, мы можем обернуть её в элемент <blockquote> и при помощи атрибута cite указать источник, откуда мы её взяли. Ну и в браузере это будет выглядеть как-то вот так. В этом видео вы узнали о некоторых элементах, группирующих своё содержимое, а в следующем видео я продолжу рассказывать про этот тип элементов и расскажу, как создавать списки.
