Перейти к публикации

Интеграция картинки в полные новости


Рекомендованные сообщения

И снова здравствуйте! Столкнулся со следующей проблемой: 

Пытаюсь добавить картинку из доп. поля в редакторе при помощи [xfvalue_image_url_X] в полноценную новость и чтобы она масштабировалась наделяю ее css свойствами background-size: cover. 

Делаю так:

<div class="title_img">
    <img src="[xfvalue_image_url_images]">
    </div>

.title_img {
    width: 100%;
    height: 250px;
    overflow: hidden;
    background-size: cover;
}

Не работает. 

Делал так:

<div class="title_img"></div>

.title_img {
    background-image: url("[xfvalue_image_url_images]");
    width: 100%;
    height: 250px;
    overflow: hidden;
    background-size: cover;
}

Не работает. Наверное странно ожидать, что [тег] в css заработает. Пытаюсь, как умею...

Может кто подскажет решение ?

 

Изменено пользователем q8.drew
Ссылка на сообщение
Поделиться на других сайтах

В стилях прописать так

.title_img {
background-size: no-repeat;
background-position: center;
background-size: cover;
height: 100%;
width: 100%;
}

а код вывода так

<div class="title_img" style="background-image:url([xfvalue_image_url_images]);">
    
</div>
                              

 

  • Спасибо 1
Ссылка на сообщение
Поделиться на других сайтах
9 часов назад, q8.drew сказал:

Наверное странно ожидать, что [тег] в css заработает.

Если пишешь это в файл css, конечно не заработает.

Такой вариант css надо добавлять в шаблон вывода новости.

Ссылка на сообщение
Поделиться на других сайтах

[xfvalue_image_url_images] разве работает в редакторе?

А так то ясно, background-size это для фона а не картинки. Для картинки надо object-fit: cover

Ссылка на сообщение
Поделиться на других сайтах
6 часов назад, aleksandrhristich сказал:

В стилях прописать так


.title_img {
background-size: no-repeat;
background-position: center;
background-size: cover;
height: 100%;
width: 100%;
}

а код вывода так


<div class="title_img" style="background-image:url([xfvalue_image_url_images]);">
    
</div>
                              

 

Заработало ! Благодарю тебя дорогой :)

4 часа назад, MSK сказал:

Если пишешь это в файл css, конечно не заработает.

Такой вариант css надо добавлять в шаблон вывода новости.

Пытался, но написал криво и не заработало. А постом выше увидел, где не прав. 

Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас
×
×
  • Создать...