HTML верстка Когда использовать Bootstrap/FlexBox/CSS Grid?

Question

[yskl24]

Всем здравствуйте
Изучил когда то Bootstrap, планирую освоить FlexBox и CSS Grid.

Не могу понять когда что применять и в каких случаях?

На youtube находил в комментариях что если дизайнер работал по сетке, то верстать на Bootstrap, если не по сетке - то FlexBox.

Кто объяснит?
Буду очень благодарен.

Comments

[WapSter]

Поверстай без бутстрапа будешь знать

[Ankhena]

Берете задачу, решаете флексами. Потом гридами.
Если решается и тем и другим, выбираете более красивое решение.

[FeST1VaL]

по сути кому как нравится... Я например больше склоняюсь к флексам.
Бутстрап не люблю...

Answer 1

[Иван В]

Вы сравниваете очень разные вещи.

Bootstrap - CSS фреймворк с адаптивной сеткой и набором готовых компонентов (кнопки, табы, аккордеон и т.д.).
Flexbox - набор CSS свойств для позиционирования элементов.

Вы можете использовать эти все вместе. Более того, в самом Bootstrap сейчас уже используются флексы (и в сетке, и в компонентах).

Если есть задача по быстрому сделать страницу \ лэндинг или сделать прототип интерфейса, то Bootstrap вполне подойдет.

Выбирайте технологии которые лично вам помогают в работе.

Comments

[yskl24]

Спасибо за совет Вам.
Bootstrap некоторые не советуют использовать, т.к. он громоздкий, можно адаптив без него сделать.
Но насчет элементов в бутстрапе согласен.
Используя их время экономиться.

Помню, когда использовал бутстрап, то при ресайзе(адаптив), все равно блоки съезжали.

И такой момент, если сейчас требуется семантическая верстка, то как ее реализовать на бутстрапе?

[Иван В]

yskl24,
Семантика - это про html теги.
Header, nav, footer, section, aside и т.д.

Bootstrap - это про классы.

Т.е. совмещайте как хотите. Например:

<header class="col-12"> ... </header>

[yskl24]

Иван В, большое спасибо за все советы, прояснили интересующие вопросы)

Answer 2

[Lord_Dantes]

если дизайнер работал по сетке, то верстать на Bootstrap

Не совсем обязательно.

Я например использую лишь сетку бутстрапа но в последнее время просто делаю условный container шириной 1140 или какая указана в макете шириной и по ней делаю флексами, так удобней я думаю гораздо.

Comments

[yskl24]

flex'ы действительно удобная штука, удобней даже чем та же сетка в bootstrap.

Answer 3

[profesor08]

Когда использовать Bootstrap/FlexBox/CSS Grid?

Когда хочешь. Я серьезно, используй что больше нравится.