@Rufix

Как правильно верстать такие блоки на bootstrap?

wTClW8X.png

Подскажите как грамотное верстаются такие блоки с бутстрапом?

Я остановился на этом варианте, но так как нет опыта в бутстрапе, решил все-таки спросить, чтобы не говнокодить в дальнейшем
<div class="row">
      <div class="col-12">
        <h1>We are awesome creative agence</h1>
      </div>
      <div class="col-12">
        <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quo, magni!</p>
      </div>
    </div>
  • Вопрос задан
  • 205 просмотров
Решения вопроса 2
iiiBird
@iiiBird Куратор тега CSS
Пока ты спишь - твой конкурент совершенствуется
зачем тебе тут вообще колонки бутстрапа?
Ответ написан
TTATPuOT
@TTATPuOT
https://code.patriotovsky.ru/
Ну, вообще, в том, что вы написали нет ничего противозаконного. Просто, это не очень хороший стиль. Куда лучше написать вот так:
<div class="row">
  <div class="col-12">
    <h1>We are awesome creative agence</h1>
    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quo, magni!</p>
  </div>
</div>

А отступ задать через заранее созданный классы с margin'ами, или в CSS дописать.
Всегда думайте о том, чтобы использовать как можно меньше тегов. Многие очень грешат тем, что делают по несколько div'ов там, где они вообще не нужны. Это улучшает читаемость кода, оптимизирует работу браузера/JavaScript и снижает вес страницы.

Ну и да, вам на такой простой блок колонки бутстрапа не сдались, действительно. Можете вообще сократить до:
<h1>We are awesome creative agence</h1>
<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quo, magni!</p>

Если же вас интересует контейнер - дело другое.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
AlexanderMarginal
@AlexanderMarginal
Frontend web developer
Это лучше всего вот так написать
<div class="container-fluid">
    <h1>We are awesome creative agence</h1>
    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quo, magni!</p>
</div>

Потому что сетка тут не нужна
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы