Так что я использую bootstrap css
с моего сайта PHP. По какой-то причине я могу получить img src
печатать просто отлично, используя то же место. Но когда мне нужно использовать background-image, изображения не отображаются. Я не могу понять, почему. Вот раздел, который я пытаюсь показать, чтобы показать стандартный код начальной загрузки.
//<!-- Wrapper for slides -->
echo '<div class="carousel-inner">';
echo '<div class="item active">';
echo '<div class="fill" style="background-image:url("http://placehold.it/1900x1080&text=Slide One");"></div>';
echo '<div class="carousel-caption">';
echo '<h2>Caption 1</h2>';
echo '</div>';
echo '</div>';
echo '<div class="item">';
echo '<div class="fill" style="background-image:url("http://placehold.it/1900x1080&text=Slide Two");"></div>';
echo '<div class="carousel-caption">';
echo '<h2>Caption 2</h2>';
echo '</div>';
echo '</div>';
echo '<div class="item">';
echo '<div class="fill" style="background-image:url("http://placehold.it/1900x1080&text=Slide Three");"></div>';
echo '<div class="carousel-caption">';
echo '<h2>Caption 3</h2>';
echo '</div>';
echo '</div>';
echo '</div>';
Заполнить CSS это:
header.carousel .fill {
width: 100%;
height: 100%;
background-position: center;
background-size: cover;
}
Когда я положил его в нормальном html
файл работает нормально. Тем не менее, я использую php
и автозагрузка, следовательно, необходимо использовать операторы echo для распечатки html-частей. Я не знаю, почему это не отображает изображения. Есть идеи?
Ваши цитаты противоречивы.
Пытаться echo '<div class="fill" style="background-image:url(\'http://placehold.it/1900x1080&text=Slide One\');"></div>';
CSS выглядит нормально, должно быть проблема с CORS. Предполагая, что вы используете https на своем сайте, ваши URL должны быть тоже https. Или вы можете просто удалить протокол и позволить URL-адресам начинаться с «//», а затем он автоматически загружается по тому протоколу, который загружен на вашей странице.
Кроме того, используйте heredocs, этот стек эха противен.
echo <<<HTM
your
html
goes here
HTM;