Перейти к содержимому


Как Сделать Разными Фоны Шапки, Общего Тела И Подвала?

Автор kislovodchanin, 21 июля 2014 23:27

  • Авторизуйтесь для ответа в теме
Сообщений в теме: 14

#1 kislovodchanin

kislovodchanin

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 111 сообщений
  • ГородКисловодск

Отправлено 21 Июль 2014 - 23:27

Хотелось бы сделать плавный переход в картинках от шапки, к подвалу.
К примеру в шапке у меня островок с деревьями,
в теле вода, то есть река.
А в подвале уже другой берег реки к примеру?

#2 Сake

Сake

    Активный участник

  • Модератоpы
  • 5 979 сообщений

Отправлено 21 Июль 2014 - 23:46

Для этого вам необходимо использовать изображения (если они у вас имееются) которые позволят реализовать это.
Попробуйте обратится с данным вопросом к дизайнеру.

#3 kislovodchanin

kislovodchanin

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 111 сообщений
  • ГородКисловодск

Отправлено 22 Июль 2014 - 00:00

Просмотр сообщенияСake (21 Июль 2014 - 23:46) писал:

Для этого вам необходимо использовать изображения (если они у вас имееются) которые позволят реализовать это.
Попробуйте обратится с данным вопросом к дизайнеру.
Изображения есть, вопрос куда их вставлять что бы получить необходимый эффект?

#4 Сake

Сake

    Активный участник

  • Модератоpы
  • 5 979 сообщений

Отправлено 22 Июль 2014 - 00:18

Стили зависят от изображений. Можно использовать примерно следующий код в файле стилей

#header-fluid {
  background: url("{ASSETS_IMAGES_PATH}/bg-top.png") no-repeat fixed center top #fafafa !important;
}
#content-fluid {
  background: url("{ASSETS_IMAGES_PATH}/bg-center.png") no-repeat fixed center top #fafafa !important;
}
#footer-fluid {
  background: url("{ASSETS_IMAGES_PATH}/bg-bottom.png") no-repeat fixed center bottom #fafafa !important;
}

где каждое изображение "bg-top.png", "bg-center.png", "bg-bottom.png" это отдельная часть общего фона. Так же можно попробовать использовать полноценное фиксированное изображение. Стиль примет вид

body {
  background: url("{ASSETS_IMAGES_PATH}/bg.png") no-repeat fixed center top #fafafa !important;
}

#5 kislovodchanin

kislovodchanin

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 111 сообщений
  • ГородКисловодск

Отправлено 22 Июль 2014 - 20:49

Просмотр сообщенияСake (22 Июль 2014 - 00:18) писал:

Стили зависят от изображений. Можно использовать примерно следующий код в файле стилей 
 #header-fluid { background: url("{ASSETS_IMAGES_PATH}/bg-top.png") no-repeat fixed center top #fafafa !important; } #content-fluid { background: url("{ASSETS_IMAGES_PATH}/bg-center.png") no-repeat fixed center top #fafafa !important; } #footer-fluid { background: url("{ASSETS_IMAGES_PATH}/bg-bottom.png") no-repeat fixed center bottom #fafafa !important; }
где каждое изображение "bg-top.png", "bg-center.png", "bg-bottom.png" это отдельная часть общего фона. Так же можно попробовать использовать полноценное фиксированное изображение. Стиль примет вид 
 body { background: url("{ASSETS_IMAGES_PATH}/bg.png") no-repeat fixed center top #fafafa !important; }

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

#6 kislovodchanin

kislovodchanin

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 111 сообщений
  • ГородКисловодск

Отправлено 23 Март 2015 - 18:35

Просмотр сообщенияСake (22 Июль 2014 - 00:18) писал:

Стили зависят от изображений. Можно использовать примерно следующий код в файле стилей

#header-fluid {
background: url("{ASSETS_IMAGES_PATH}/bg-top.png") no-repeat fixed center top #fafafa !important;
}
#content-fluid {
background: url("{ASSETS_IMAGES_PATH}/bg-center.png") no-repeat fixed center top #fafafa !important;
}
#footer-fluid {
background: url("{ASSETS_IMAGES_PATH}/bg-bottom.png") no-repeat fixed center bottom #fafafa !important;
}

где каждое изображение "bg-top.png", "bg-center.png", "bg-bottom.png" это отдельная часть общего фона. Так же можно попробовать использовать полноценное фиксированное изображение. Стиль примет вид

body {
background: url("{ASSETS_IMAGES_PATH}/bg.png") no-repeat fixed center top #fafafa !important;
}

Доброго времени суток.
А подскажите пожалуйста, какого размера делать изображение, если использовать стиль вот такого вида?
body {
  background: url("{ASSETS_IMAGES_PATH}/bg.png") no-repeat fixed center top #fafafa !important;
}
И не отразится ли установка на адаптивности дизайна, то есть будет ли картинка сжиматься до размера экрана мобильных устройств?
Буду признателен за ответ.

#7 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 01 Апрель 2015 - 06:35

Если фон будет фиксированный то стандартный максимальный размер используйте 1920х1080.
Чтобы фон был резиновым пропорционально, кроме написания самого фона, пропишите стиль background-size: cover;
Пример:
body {
  background: url("{ASSETS_IMAGES_PATH}/bg.png") no-repeat fixed center top #fafafa !important;
  background-size: cover;
}

#8 kislovodchanin

kislovodchanin

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 111 сообщений
  • ГородКисловодск

Отправлено 02 Апрель 2015 - 08:14

Просмотр сообщенияVaccina (01 Апрель 2015 - 06:35) писал:

Если фон будет фиксированный то стандартный максимальный размер используйте 1920х1080.
Чтобы фон был резиновым пропорционально, кроме написания самого фона, пропишите стиль background-size: cover;
Пример:
body {
background: url("{ASSETS_IMAGES_PATH}/bg.png") no-repeat fixed center top #fafafa !important;
background-size: cover;
}

Доброго времени суток!
Поясните мне пожалуйста, для тех кто в танке.
что, за что отвечает в данном файле стилей.
body {
  background: url("{ASSETS_IMAGES_PATH}bg1.png") no-repeat fixed center top, url("{ASSETS_IMAGES_PATH}bg2.png") no-repeat fixed center bottom, url("{ASSETS_IMAGES_PATH}bg3.png") repeat-y fixed center top;
  background-size: cover;
}
Желательно подробно, как младенцу.
За ранее спасибо.

#9 Alekseys

Alekseys

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 2 355 сообщений

Отправлено 02 Апрель 2015 - 09:35

Просмотр сообщенияkislovodchanin (02 Апрель 2015 - 08:14) писал:

Доброго времени суток!
Поясните мне пожалуйста, для тех кто в танке.
что, за что отвечает в данном файле стилей.
body {
background: url("{ASSETS_IMAGES_PATH}bg1.png") no-repeat fixed center top, url("{ASSETS_IMAGES_PATH}bg2.png") no-repeat fixed center bottom, url("{ASSETS_IMAGES_PATH}bg3.png") repeat-y fixed center top;
background-size: cover;
}
Желательно подробно, как младенцу.
За ранее спасибо.
Здравствуйте. Код
background: url("{ASSETS_IMAGES_PATH}bg1.png") no-repeat fixed center top, url("{ASSETS_IMAGES_PATH}bg2.png") no-repeat fixed center bottom, url("{ASSETS_IMAGES_PATH}bg3.png") repeat-y fixed center top;
отвечает за изображения основного фона, а
background-size: cover;
растягивает изображение на весь фон.

#10 kislovodchanin

kislovodchanin

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 111 сообщений
  • ГородКисловодск

Отправлено 05 Апрель 2015 - 01:55

Подскажите, почему при просмотре сайта магазина на мобильном устройстве, название магазина, не выравнивается по центру, под лого?
Где копать и что подправить, подскажите?

#11 Cupuyc

Cupuyc

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 747 сообщений

Отправлено 05 Апрель 2015 - 10:40

Просмотр сообщенияkislovodchanin (05 Апрель 2015 - 01:55) писал:

Подскажите, почему при просмотре сайта магазина на мобильном устройстве, название магазина, не выравнивается по центру, под лого?
Где копать и что подправить, подскажите?

Здравствуйте, зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> style.css найдите код:
#header-logo a{display:table-cell;vertical-align:middle;text-align:center; text-decoration: none;font: normal 18px 'Open Sans',Helvetica,Arial;color: #da3b44;font-weight: 600;}

Замените его на:
#header-logo a{display:table-cell;vertical-align:middle;text-align:center!important; text-decoration: none;font: normal 18px 'Open Sans',Helvetica,Arial;color: #da3b44;font-weight: 600;}

#12 kislovodchanin

kislovodchanin

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 111 сообщений
  • ГородКисловодск

Отправлено 05 Апрель 2015 - 12:53

Просмотр сообщенияCupuyc (05 Апрель 2015 - 10:40) писал:

Здравствуйте, зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> style.css найдите код:
#header-logo a{display:table-cell;vertical-align:middle;text-align:center; text-decoration: none;font: normal 18px 'Open Sans',Helvetica,Arial;color: #da3b44;font-weight: 600;}

Замените его на:
#header-logo a{display:table-cell;vertical-align:middle;text-align:center!important; text-decoration: none;font: normal 18px 'Open Sans',Helvetica,Arial;color: #da3b44;font-weight: 600;}

Всё получилось, спасибо.

#13 kislovodchanin

kislovodchanin

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 111 сообщений
  • ГородКисловодск

Отправлено 14 Апрель 2015 - 21:15

Доброго времени суток.
Столкнулся с проблемой, нужно сделать так, что бы у каждого сформированного заказа (нового) было определённое время жизни, до оплаты.
Например, создал юзверь заказ, а оплачивать его как бы не летит, теряя тапки.
Так вот, хотелось бы, что бы такой заказ жил 24 часа с момента оформления, а после автоматом удалялся, с восстановлением остатков и предыдущего номера заказа.
Реально ли вообще сделать подобное?
Заранее благодарен....

#14 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 15 Апрель 2015 - 01:16

К сожалению, подобное реализовать нельзя, так как данные изменения касаются непосредственно административной панели сайта.

#15 kislovodchanin

kislovodchanin

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 111 сообщений
  • ГородКисловодск

Отправлено 15 Апрель 2015 - 06:41

Просмотр сообщенияVaccina (15 Апрель 2015 - 01:16) писал:

К сожалению, подобное реализовать нельзя, так как данные изменения касаются непосредственно административной панели сайта.
Спасибо за ответ.
Жаль, что подобное не возможно((( мне очень бы пригодились, данная возможность.
Обратно в Изменение общей стилистики


Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных

  1. Форум владельцев интернет-магазинов
  2. → Вопросы работы сервиса StoreLand
  3. → Дизайн
  4. → Шаблон Осень
  5. → Изменение общей стилистики
  6. Privacy Policy