1. Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела
    Скрыть объявление

[Помогите] Использование 2 background с некоторыми правками

Тема в разделе "Вёрстка (HTML, CSS)", создана пользователем AlexGood, 9 апр 2018.

  1. AlexGood

    AlexGood

    Регистрация:
    28 ноя 2016
    Сообщения:
    254
    Симпатии:
    7
    Вот пример описания CSS использования 2-х background:
    background: url(../../images/fon1.png) no-repeat, url(../../images/fon2.jpg) no-repeat;
    Вопрос: как правильно описать css если одному из фонов, нужно задать background-size: cover, а другому нет - как это правильно описать?
     
    AlexGood, 9 апр 2018
    #1
  2. Dotrox

    Dotrox Команда форума

    Регистрация:
    27 ноя 2012
    Сообщения:
    3.198
    Симпатии:
    1.306
    Надо разделить background на отдельные свойства и задавать их синхронно:
    HTML:
    background-image: url(../../images/fon1.png), url(../../images/fon2.jpg);
background-size: auto, cover;
    Либо, если одним свойством, то так:
    HTML:
    background: center / cover url(../../images/fon1.png) no-repeat, url(../../images/fon2.png) no-repeat;
    Но тут обязательно, чтоб background-size шёл через слеш сразу после background-position!
     
    Последнее редактирование: 10 апр 2018
    Dotrox, 10 апр 2018
    #2
    AlexGood нравится это.
  3. AlexGood

    AlexGood

    Регистрация:
    28 ноя 2016
    Сообщения:
    254
    Симпатии:
    7
    я вот так обыграл по вашему примеру:
    url(../../images/arm.png) 80% 100% /27% no-repeat,
    url(../../images/fon3.jpg) 0px 0px/cover no-repeat
     
    AlexGood, 10 апр 2018
    #3
< Адаптивное меню bootstrap4 - есть нюансы? | Увеличение всего блока с содержимым в размерах при наведении >