46. Frontender[1.0] Container vs Wrapper. Классы HTML & CSS

Привет!📢
▶ Telegram: t.me/Dmitry_Ko...
▶ GitHub: github.com/Dmi...
▶ Linkedin: / kolotilshikov
Container vs Wrapper. Классы HTML & CSS
Это 46 видео первого модуля большого, актуального и бесплатного курса на ютубе по фронтенд разработке. Курс подойдет для новичков и для людей, которые что-то когда-то учили или учат, также тех кто хочет освежить знания. На курс трачу очень много времени, чтобы контент получался качественный, плюс качественная картинка и звук, а самое главное стараюсь рассказывать всё простым языком.
К каждому уроку также есть PDF файл по теме урока, который можете скачать у меня в телеграм-канале под анонсом данного урока.
Ваша обратная связь обязательна =)
Курс разделен на 3 модуля:
1) HTML, CSS, SCSS, БЭМ, Flexbox, Grid, Bootstrap, GIT, FIGMA, верстка 3 макетов (100 уроков);
2) JavaScript, решение задач, написание нескольких приложений;
3) React, Typescript, Redux написание полноценного приложения;
НЕ СОМНЕВАЙТЕСЬ И РАЗВИВАЙТЕСЬ! У ВАС ВСЁ ПОЛУЧИТСЯ! :)
Желаю приятного обучения! 🔥
▶ Графический дизайн и анимация: t.me/getlogo
📢 ПЛЕЙЛИСТ FRONTENDER[1.0] - 1 Модуль: • 2024 КУРС | Frontender...
Также тебе могут быть полезны эти уроки:
📢 HTML для начинающих за 33 минуты: • HTML для начинающих за...
📢 CSS для начинающих + практика за 24 минуты: • CSS для начинающих + п...
📢 FLEXBOX. Всё о flexbox в одном уроке: • FLEXBOX. Всё о flexbox...
📢 FLEXBOX. Всё о flexbox | Практика: • FLEXBOX. Всё о flexbox...
FRONTENDER[1.0] полный, структурированный и бесплатный курс по фронтенд разработке на KZbin.
📢 Автор курса: Дмитрий Колотильщиков
#html #frontend #frontender

[@KirylKurtsou]

Привет! Ни разу не видел связку container + wrapper. 🤔 Продолжай своё дело, оно маленькими видеоматериалами делает большое дело.

[@dmitry_kolotilshikov]

🙏

[@danilgaenkov7706]

Спасибо за урок!

[@weepie9103]

хороший урок, thx !

[@dmitry_kolotilshikov]

🫶

[@МихаилВедерников-ь7ш]

Приём, приём. Хух, интересно, но не понятно 🙂 Едем дальше. Пока что не в потоке, до конца нет понимая потока, гугл мне в помощь или на втором круге видео войду в поток 🙂

[@dmitry_kolotilshikov]

👍👍👍

[@denzeroneYT]

Найс, как раз недавно использовал это все, только сильной разницы не понимал, как я понял, это такие общие названия, чтобы если другой человек посмотрел на код, и если он увидит контейнер, то сразу будет понимать что это примерно такое, благодаря известному названию. Я вот как начал использовать контейнер, использую его именно там, где какое-то наполнение, ну типа header, main, footer, внутри них навигация, основной контент, контент подвала, для этого и добавляю контейнер, а основной тег использую, чтобы фоновый цвет был на всю ширину экрана, хз насколько это правильно, но просто если в контейнер все добавить, то как сделать фон на 100% экрана. Хотя и подобные сайты по типу первого варианта видел. Ну второй способ, так выглядит, как я и описывал

[@dmitry_kolotilshikov]

👍👍👍

[@MrAprise]

зашел урок

[@dmitry_kolotilshikov]

👌

[@abbosvaliev6498]

2 способ более профессионально

[@dmitry_kolotilshikov]

Зависит от ситуации)

[@themowerstump]

Я уже сам как враппер

[@dmitry_kolotilshikov]

😅

[@PavelMikhalkevich]

ваш любимый не lightcoral, но lightsalmon :)

[@dmitry_kolotilshikov]

Именно лосось, все верно, вы наблюдательный🙏🥰

[@mexvision-3556]

Крайне странный подбор неймингов в 1 варианте. Я обычно использую 2 вариант, но все секции всё ровно оборачиваю во wrapper. Он как правило 100% по ширине. Для чего он нужен? Слои вашего сайта. Модалки это один слой, wrapper это другой слой. И мы всегда понимаем, всё что находится внутри wrapper, никак не перекроет модальное окно. Я считаю что при верстке надо предусмотреть это. Так как в будущем, появляются тултипы, мессаги т.п. И для каждого подобного типа надо выделить свой пул z-index. Обычно это: основной слой (контент сайта), слой модальных окон, слой алертов, слой тултипов. В идеале еще и в переменные вогнать.