Member 12595545 Ответов: 2

Веб-сайт реагирует на bootstrap, текст-нет


Ну, я придумал какой-то код для создания сайта;

HTML
<div class="jumbotron-middle">
    <div class="container">
        <h1 class="h1-2" align="center">
            M<span class="letter2">A</span>KING<br>
            IMP<span class="letter2">O</span>SSIBLE<br>
            P<span class="letter2">O</span>SSIBLE.
        </h1>
        <hr>
    </div>
</div>


CSS
.jumbotron-middle {
    background-color: #fff;
    height: 700px;
}


Теперь проблема в том, что он вообще не реагирует! если я делаю страницу наполовину или смотрю ее на свой телефон, текст просто обрезается....

Какие-нибудь советы?

Что я уже пробовал:

Не так уж много, потому что я новичок в программировании.

Richard Deeming

Вам нужно HTML-кодировать ваши блоки кода и обернуть их в <pre>...</pre> теги.

Я исправил форматирование ваших блоков кода для вас.

2 Ответов

Рейтинг:
2

Richard Deeming

Воспользуйся CSS медиа запросы[^] для настройки размера текста в зависимости от ширины окна браузера.

Вам нужно будет решить, какого размера вы хотите, чтобы текст был в соответствующих точках останова. Например:

.jumbotron-middle h1 {
  font-size: 1.2em;
}
@media (min-width: 480px) {
  .jumbotron-middle h1 {
    font-size: 2em;
  }
}
@media (min-width: 768px) {
  .jumbotron-middle h1 {
    font-size: 3em;
  }
}

Демонстрация[^]


Рейтинг:
1

Peter Leow

Изменить

<div class="jumbotron-middle">

к
<div class="jumbotron jumbotron-middle">

Убедитесь, что вы правильно настроили свой bootstrap. Проверить это: Загрузка Ваших Веб – Страниц 1-Подготовка К Работе[^]