Skocz do zawartości
Urlop / Vacation Czytaj dalej... ×
  • Zarejestruj się
  • 0
Mdx

Połączenie gradientu i obrazka w jednym elemencie

Pytanie

Czy jest jakiś sposób żeby połączyć gradient (w css) i obrazek tła w jednym elemencie?
 
Przeszukuje internet i wszystko co znajdę nie działa.
 
Próbowałem już:

background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #000000),
    color-stop(1, #8A868A)
), url({style_images_url}/maintitle.png) no-repeat right;
background-image: -o-linear-gradient(top, #000000 0%, #8A868A 100%), url({style_images_url}/maintitle.png) no-repeat right;
background-image: -moz-linear-gradient(top, #000000 0%, #8A868A 100%), url({style_images_url}/maintitle.png) no-repeat right;
background-image: -webkit-linear-gradient(top, #000000 0%, #8A868A 100%), url({style_images_url}/maintitle.png) no-repeat right;
background-image: -ms-linear-gradient(top, #000000 0%, #8A868A 100%), url({style_images_url}/maintitle.png) no-repeat right;
background-image: linear-gradient(to top, #000000 0%, #8A868A 100%), url({style_images_url}/maintitle.png) no-repeat right;
 
background-image: url({style_images_url}/maintitle.png) no-repeat right, -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #000000),
    color-stop(1, #8A868A)
);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -o-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -moz-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -webkit-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -ms-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, linear-gradient(to top, #000000 0%, #8A868A 100%);
 
background-image: url({style_images_url}/maintitle.png) no-repeat right;
background-image: url({style_images_url}/maintitle.png) no-repeat right, -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #000000),
    color-stop(1, #8A868A)
);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -o-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -moz-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -webkit-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -ms-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, linear-gradient(to top, #000000 0%, #8A868A 100%);
 
background-image: url({style_images_url}/maintitle.png) no-repeat right, -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #000000),
    color-stop(1, #8A868A)
);
background-image: -o-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -moz-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: -webkit-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: -ms-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: linear-gradient(to top, #000000 0%, #8A868A 100%);
 
 
 
Efekt jaki uzyskałem to albo całkowity brak tła, albo gradient bez obrazka.
 
Z góry dzięki za pomoc ;)

Udostępnij ten post


Link to postu
Udostępnij na innych stronach

3 odpowiedzi na to pytanie

Polecane posty

  • 0


Efekt jaki uzyskałem to albo całkowity brak tła, albo gradient bez obrazka.

 

no i moim zdaniem tak bedzie

 

jesli przykryjesz stol obrusem to blatu nie widzisz

 

ewntualnie mozliwe ze moze to zadzialac na polprzezroczystym obrazku (nigdy nie probowalem)

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

Nie ma możliwości. albo jedno albo drugie

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

Musisz zdecydować do wolisz.. Nie da się połączyć kurtki z kamizelką :).

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
Gość
Temat jest zablokowany i nie można w nim pisać.

  • Kto przegląda   0 użytkowników

    Brak zalogowanych użytkowników przeglądających tę stronę.

×

Ważne informacje

W celu świadczenie usług przez nasz Serwis na najwyższym poziomie, w ramach Serwisu wykorzystujemy pliki Cookies (tzw. ciasteczka). Korzystając ze stron Serwisu IPSBEYOND.PL bez zmiany ustawień przeglądarki będą one zapisane w pamięci urządzenia. Jeżeli nie dokonacie Państwo zmiany ustawień przeglądarki internetowej to wyrażacie zgodę na zapisywanie plików Cookies.