Резиновая картинка

  • 9 Ответов
  • 319 Просмотров

0 Пользователей и 1 Гость просматривают эту тему.

*

Оффлайн lepic

Резиновая картинка
« : 02.11.2016, 08:03:44 »
Извините за нубский вопрос.
Есть картинка большого разрешения.
В стандартной теме protostar запилил картинку на главную.
Нужно чтобы размеры картинки автоматически подбивались соответственно размеру окна/экрана,  какой код вставить в template.css?
Спасибо

*

Оффлайн Arkadiy

  • *****
  • 5340
  • [+]440 / [-]0
  • Крепитесь, други.
    • Просмотр профиля
    • http://argens.ru

*

Оффлайн lepic

Re: Резиновая картинка
« Ответ #2 : 02.11.2016, 08:17:00 »
А можно полный код, а то я полный нуб...
Что бы я сделал ctrl+c ctr-v и все заработало )))

Re: Резиновая картинка
« Ответ #3 : 02.11.2016, 08:22:47 »
.class-izobrajeniya { max-width: 640px; width: 100%; }
Ставь лайк, если согласен, и делай репост!

  => мои публикации
    => мои работы
      => спектр моих услуг

*

Оффлайн lepic

Re: Резиновая картинка
« Ответ #4 : 02.11.2016, 08:36:27 »
.class-izobrajeniya { max-width: 640px; width: 100%; }
Мне нужен полный код файла template.css
Указанный Вами код не работает ни в пустом файле template.css, ни в оригинальном заполненном файле template.css от темы protostar, где очень много строк.

Re: Резиновая картинка
« Ответ #5 : 02.11.2016, 08:38:56 »
.class-izobrajeniya { max-width: 100%; height: auto; }
Ставь лайк, если согласен, и делай репост!

  => мои публикации
    => мои работы
      => спектр моих услуг


*

Оффлайн Ragivort

  • ******
  • 1010
  • [+]51 / [-]2
  • Есть мечта-стоит жить
    • Просмотр профиля
    • IT Premium
Re: Резиновая картинка
« Ответ #7 : 02.11.2016, 13:56:26 »
А можно полный код, а то я полный нуб...
Что бы я сделал ctrl+c ctr-v и все заработало )))

Улыбнуло)))
В редакторе пропишите картинке класс class-izobrajeniya, как вариант)
Дозволь мне свершить то добро, которое я способен свершить, теперь, ибо я могу более не вернуться сюда.

*

Оффлайн lepic

Re: Резиновая картинка
« Ответ #8 : 02.11.2016, 16:50:03 »
Всем спасибо за ответы!

*

Оффлайн lepic

Re: Резиновая картинка
« Ответ #9 : 02.11.2016, 23:25:41 »
Обозначение класса в CSS, да и вообще задействование CSS не дало 100% положительный результат - в Mozilla и Chrome все отображалось корректно. В експлорере и адблок браузер картинка отображалась некорректно - при загрузке страницы картинка отображалась исходного размера, тоесть картинка вылазит за пределы экрана.
Проблему решил, отказавшись от файла *.css и прописав в index.html <img src="img.jpg" style="max-width: 100%; height: auto;" />
При этом от Joomla пришлось вообще отказаться и создать просто файл index.html.
Как это дело заставить работать в Joomla, тема протостар, используется бутстрап, я так и не понял.