Vrlo često možete pronaći odgovarajuću sliku na Internetu, na primjer, da je umetnete na web mjesto. Ili možda radite kolaž, a jednom crtežu trebate dodati druge. Ali slike koje trebate obično imaju neku vrstu pozadine.

Hajdemo shvatiti kako možemo napravite prozirnu pozadinu za sliku pomoću uređivačaAdobePhotoshop. Imam instaliranu englesku verziju Adobe Photoshop CS5, pa ću vam je pokazati.

Pokušat ću pružiti različite kombinacije prečaca.

Ako još nemate instaliran Photoshop, rijetko ga koristite ili je na engleskom, možete napraviti prozirnu pozadinu u Paint.net. Ovo je jednostavan uređivač slika na ruskom jeziku koji neće zauzeti puno prostora na vašem tvrdom disku. Klikom na poveznicu možete pročitati detaljan članak. Program Paint.net možete preuzeti s naše web stranice.

Prvo, pogledajmo jednostavan primjer. Recimo da imate sliku na običnoj pozadini, to može biti logotip ili naziv nečega. Napravimo ovaj logo ili natpis na prozirnoj pozadini u Photoshopu.

Otvorite željenu sliku u editoru. Sada napravimo prozirnu pozadinu za sloj. U prozoru "Slojevi" dvaput kliknite na dodani sloj - nasuprot njega će se nalaziti lokot. Otvorit će se prozor "Novi sloj", kliknite "U redu" u njemu. Nakon toga, brava će nestati.

Odaberite alat "Čarobni štapić". Na traci svojstava odredite razinu osjetljivosti, postavite različite vrijednosti da biste razumjeli kako radi, na primjer, 20 i 100. Da biste poništili odabir slike, pritisnite "Ctrl+D".

Postavite osjetljivost i čarobnim štapićem kliknite na područje pozadine. Kako biste odabranoj pozadini dodali one dijelove koji nisu odabrani, držite pritisnut “Shift” i nastavite s odabirom. Za brisanje odabranih područja kliknite na "Izbriši".

Sada umjesto pozadine postoji šahovnica - to znači da smo uspjeli učiniti bijelu pozadinu prozirnom. Ukloni odabir – “Ctrl+D”.

Ako imate sliku ili fotografiju koja ima puno različitih boja i objekata, pogledajmo kako napraviti prozirnu pozadinu za sliku u Photoshopu.

U ovom slučaju koristit ćemo se alatom za brzi odabir. Kliknite na čarobni štapić lijevom tipkom miša uz malu odgodu i odaberite željeni alat iz izbornika.

Sada trebamo odabrati objekt koji želimo ostaviti na prozirnoj pozadini. Na traci svojstava postavite različite veličine i kliknite na objekt, dodajući mu područja. Ako je greškom odabrana nepotrebna pozadina, pritisnite "Alt" i uklonite je.

Za pregled rezultata pritisnite "Q". Oni dijelovi slike koji će postati prozirni bit će označeni ružičastom bojom.

Kopirajte odabrana područja pritiskom na “Ctrl+C”. Zatim stvorite novu datoteku, "Ctrl+N", s prozirnom pozadinom.

Zalijepite kopirane fragmente u njega, "Ctrl + V". Ako su na njima ostali nepotrebni dijelovi pozadine, uklonite ih alatom Eraser. Slike snimljene na prozirnoj pozadini spremamo u PNG ili GIF formatu.

Učinite bijelu pozadinu slike prozirnom ili napravite prozirnu pozadinu za pojedinačne fragmente slike u boji ili fotografije u Photoshopu. Nakon toga ih možete koristiti gdje je potrebno: umetnuti ih na web stranicu, dodati na drugi crtež ili napraviti zanimljive kolaže.

Transparentnost CSS pozadine

Transparentnost pozadine na web mjestu stvara se pomoću CSS svojstava. Transparentnost možete postići na dva načina: kroz svojstvo opacity i background:rgba(). Pogledajmo svaki od njih, a zatim napravimo usporedbu.

1. Svojstvo neprozirnosti CSS-a za prozirnost pozadine

CSS ima svojstvo neprozirnosti, koje se može koristiti za postavljanje prozirnosti slika, teksta, uključujući pozadinu.

Transparentnost se navodi jednostavno određivanjem realnog broja od 0,0 do 1,0. Što je manji broj, objekt će biti manje uočljiv.

neprozirnost: 0,5; // Zasjenjenost translucencije: 0,2; // Objekt je vidljiv samo na 20% neprozirnosti: 0.8; // Objekt je vidljiv samo 80%.

Pogledajmo primjer sa svojstvom neprozirnosti.

Tekst je također transparentan