Форум Сайтостроение Веб-строительство

2 слоя заливки

iputin
На сайте с 26.11.2013
Offline
4
iputin
341

Есть заливка градиентом 

.myStyle {background: linear-gradient(to bottom right, #FFF, #FFC89B);}

а хочу еще добавить картинку в правый угол небольшую чтобы тоже заливкой была

можно еще как-нить это сделать не прибегая к созданию второго div'a

Р
На сайте с 07.02.2013
Offline
178
рецидивист
#1

1 - Почитай тут http://htmlbook.ru/blog/dva-fona-i-bolshe

2 - Можно сделать сложный градиент: 

linear-gradient(-45deg, rgba(197,32,54,1) 0%, rgba(201,24,41,1) 2%, rgba(255,255,255,1) 17%, rgba(196,108,196,1) 27%, rgba(77,26,77,1) 41%, rgba(214,55,214,1) 53%, rgba(180,209,19,1) 69%, rgba(255,255,255,1) 83%, rgba(227,53,68,1) 95%, rgba(230,20,34,1) 100%)
Jor
На сайте с 23.06.2012
Offline
42
Jor
#2
iputin:
Есть заливка градиентом 
.myStyle {background: linear-gradient(to bottom right, #FFF, #FFC89B);}

а хочу еще добавить картинку в правый угол небольшую чтобы тоже заливкой была
можно еще как-нить это сделать не прибегая к созданию второго div'a

Как вариант, с помощью :after/before :)

iputin
На сайте с 26.11.2013
Offline
4
iputin
#3
рецидивист:
1 - Почитай тут http://htmlbook.ru/blog/dva-fona-i-bolshe

Вопрос - как подружить картинку с градиентом, там ответа нет

рецидивист:
2 - Можно сделать сложный градиент:

не нужен мне сложный градиент

Jor:
Как вариант, с помощью :after/before

напиши пример если не затруднит

Jor
На сайте с 23.06.2012
Offline
42
Jor
#4
iputin:
напиши пример если не затруднит

.myStyle {
   background: linear-gradient(to bottom right, #FFF, #FFC89B); 
   position: relative;
}

.myStyle:after {
   content: '';
   display: block;
   width: Npx;
   height: Npx;
   background: linear-gradient(to bottom right, #FFF, #FFC89B); либо background: url();
   position: absolute;
   top: 0; right: 0;
}
iputin
На сайте с 26.11.2013
Offline
4
iputin
#5

спс попробуем

ну и так на всякий случай может еще какие решения есть

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий