Перейти к содержанию
IPS Invision Community 🇷🇺

Как изменить фон шапки header?


lietuvis

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

Опубликовано

Здравствуйте, как вставить 1920x180 картинку в header вместо синего фона?

Скрытый текст

head.thumb.png.503006718a9bb09f275fbf92e616dcdf.png

 

Опубликовано

Добавьте в Custom.css

#ipsLayout_header header {
    background-image: url(https://remontanta.ru/images/Berries_img/Plum/mass_plum.jpg);
    background-attachment: fixed;
    background-repeat: repeat-x;
}

 

Опубликовано

Kартинка:

Скрытый текст

headernew.thumb.png.ff4546617e9fc3dfc78a453853620f94.png

отображается не полная:

Скрытый текст

headr1.thumb.png.0dc0233e65639f18b6967280ce42c359.png

Как правильно увеличить height 180?

Kак сделать чтобы в телефоне показывало полную картинку?

Скрытый текст

mobileheader.png.e8448279a8dbd976d37e0541b85fae6b.png

 

Опубликовано

@lietuvis Пробуйте так.

#ipsLayout_header header {
    background: url(https://домен.ru/headernew.png);
    background-size: cover;
   -moz-background-size: cover;
    background-position: center;
    padding-bottom: 60px;
}
Скрытый текст

2018-12-22_20-58-02.png2018-12-22_20-57-04.png

 

  • Спасибо 1
Опубликовано

Теперь хорошо, только на 1920x1080 не полный height картинки:

Скрытый текст

01.thumb.png.996e36f0f34bc3a8e3e449f965ca1495.png

Можно это исправить?

Как лого текст "Invision Community" сделать по центру? (сейчас он наверху)

Скрытый текст

02.png.e5ee4829ce2fd7ba193636c392f64ff8.png

 

Опубликовано
6 минут назад, lietuvis сказал:

Теперь хорошо, только на 1920x1080 не полный height картинки:

Так картинку сделайте 1920x1080  и будет вам счастье :dada:

Опубликовано

Картинка 1920x180 https://i.imgur.com/ucR6zzc.png

Я имел в виду, что если у вас разрешение экрана 1920x1080, то картинку отображает не полной высоты (1920x180), a 1920x125.

Скрытый текст

headerfix.thumb.png.4cef245bc05164ab41b780abc575197f.png

Всё равно выглядит неплохо.

@Sipsb  Спасибо за помощь.  

  • 5 месяцев спустя...
Опубликовано

Можно сделать картинку в формате jpeg/jpg

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

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

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

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

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

Войти

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

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