Автор Тема: При изменении масштаба экрана картинка фоновая передвигается  (Прочитано 195 раз)

19 Январь 2016, 17:59:16
  • Фрилансер
  • *
  • Сообщений: 216
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Подскажите пожалуйста, я вставила картинку и хочу чтобы она закрепилась и все, но при изменении масштаба экрана картинка убегает. Как же закрепить ее, подскажите пожалуйста))))  высылаю пример побега картинки http://prntscr.com/9s3ov8
19 Январь 2016, 18:14:14
Ответ #1
  • Ветеран
  • *****
  • Сообщений: 33071
  • Репутация: +26762/-0
    • Просмотр профиля
Создайде блок div с классом col-xs- ,col-sm- ,col-md- ,col-lg-. В такой блок картинку можно установить фоном и она не будет смещаться.
http://getbootstrap.com/css/#grid
19 Январь 2016, 18:18:22
Ответ #2
  • Фрилансер
  • *
  • Сообщений: 216
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Создайде блок div с классом col-xs- ,col-sm- ,col-md- ,col-lg-. В такой блок картинку можно установить фоном и она не будет смещаться.
http://getbootstrap.com/css/#grid

Извини меня,все хорошо написано, но я не понимаю((  можно прям углубиться, детально описать, что конкретно мне вставить нужно и куда. В том же файле нужно создать класс div?  :o

19 Январь 2016, 19:07:36
Ответ #3
  • Ветеран
  • *****
  • Сообщений: 33071
  • Репутация: +26762/-0
    • Просмотр профиля
Все зависит от того, как вы добавляли эту картинку. В модуль, в шаблон темы?
19 Январь 2016, 19:12:12
Ответ #4
  • Фрилансер
  • *
  • Сообщений: 216
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Все зависит от того, как вы добавляли эту картинку. В модуль, в шаблон темы?

Загрузила картинку http://prntscr.com/9s4s6u
вот здесь ее правила, думала смогу закрепить http://prntscr.com/9s4t84
19 Январь 2016, 19:18:51
Ответ #5
  • Ветеран
  • *****
  • Сообщений: 33071
  • Репутация: +26762/-0
    • Просмотр профиля
Фон можно изменить в /themes/default-bootstrap/css/global.css через background
#header {
    background...:
}
header {
    background: ...;
}
Для адаптивного дизайна - Адаптивные фоновые изображения