Przezroczystość tylko tła


(BokoBrody1337) #1

Tworzę właśnie swoją pierwszą stronę www. Z góry chciałbym zapytać, czy da się zrobić przezroczystość tła w divie, tak aby tekst nadal był widoczny ? Byłoby to proste gdyby nie to że tło to obrazek.


(krystian3w) #2
  • zapisać obrazek jako png i w edytorze dodać przezroczystość.

  • Albo dwa divy i różny poziom przezroczystości (opacity).

Pewnie są lepsze metody.


(Fizyda) #3

Da się, ale trzeba pokombinować. Zaraz podrzucę przykładowy kod.


(BokoBrody1337) #4

Chodzi ci o to aby zrobić div gdzie będzie obrazek przezroczysty a drugi div w środku z tekstem bez przezroczystości ? W sumie to najłatwiejszy sposób


(krystian3w) #5

Tak i sprawdzam czy to działa w praktyce.


(BokoBrody1337) #6

Ja również


(krystian3w) #7

Nie działa :neutral_face:


(BokoBrody1337) #8

na logike powinno, w końcu div numer 1 powinien być przezroczysty, a po ustawieniu w drugim divie opacity: 1; tekst w drugim nie powinien być przezroczysty


(BokoBrody1337) #9

Jeżeli podrzucisz kodzik, będę wdzięczny.


(Fizyda) #10

Trzymaj przykładowy kod jak to można jedynie rozwiązać. No może nie jest to jedyne rozwiązanie ale wszystkie będą analogiczne, nie da się inaczej stworzyć przeźroczystego obrazka tła chyba, że przygotujesz od razu odpowiednią grafikę.
https://jsfiddle.net/85nxL6cg/7/


(BokoBrody1337) #11

Ten pierwszy pomysł też jest zły, gdyż źle wytłumaczyłem, mam tło strony obrazkowe oraz div1 który ma kolor szary, chce aby div1 był przezroczysty ale tekst w nim nie.


(Fizyda) #12

W takim wypadku łap lepsze rozwiązanie:
https://jsfiddle.net/cpuo316g/2/

EDIT:
Dużo zależy od tego co dokładnie chcesz osiągnąć, jeśli dodatkowo potrzebujesz aby grafika tła była dynamicznie podkładana, np.: w zależności od strony przez php to kod jeszcze inaczej będzie musiał wyglądać.


(Fizyda) #13

To nie jest na logike, na logikę jest to jak działa opacity, jeśli w drzewe DOM obiekt jest przeźroczysty o 50% to jego potomkowie będą od tej wartości zaczynali. Więc jeśli jakiemuś nadasz znów 50% opacity, to tak naprawdę będzie on miał 25%, ponieważ 50% jest liczone od odziedziczonego 50%.
Oczywiście da się “wyrwać” obiekt z tego by był niejako niezależny od przodków, ale trzeba zrobić to świadomie.

Nie da się zrobić tak, że w lodówce zmniejszysz temperaturę do 2 stopni, a potem włożysz do niej pojemnik w którym będziesz chciał mieć temperaturę pokojową. Jest to nielogiczne tak samo jak to czego się spodziewałeś.


(Fizyda) #14

No to moment, jak chcesz zrobić tylko przeźroczyste jednokolorowe tło, to użyj normalnie rgba() bez żadnego kombinowania. Podajesz kolor jaki chcesz i możesz ustalić jeszcze kanał alpha.