Autor Zpráva
Lukáš93
Profil *
Ahoj,

jak vytvořím v XHTML/CSS poloprůhledné (průsvitné) jednobarevné pozadí?

Prvně jsem to chtěl vytvořit jako poloprůhledný obrázek, ale moje zkušenosti s grafickými editory jsou nízké a nainstalované mám pouze PhotoFiltre a IrfanView. Nepodařilo se mi vytvořit průstvitný jednobarevný obrázek.

Zde obrázek:
Pozadí
Žlutě šrafnutá plocha by měla být průsvitná a pozadí, které by mělo prostvítat je momentálně černé (okraje na obrázku). Pozadí ale bude nějaký obrázek, fotka, wallpaper atd.

Díky za rady.
margin
Profil *
Lukáš93:
Zde obrázek:
Nevidím ho, je to 1×1px průhledný GIF.

Výše uvedené programy neumí udělat poloprůhledný obrázek.
Z programů zdarma můžeš použít třebas Paint.NET, GIMP nebo vektorový Inkscape.
Pokud nechceš nic instalovat, můžeš použít online editor Pixlr.
panther
Profil
Lukáš93:
opacity
margin
Profil *
panther:
Možná se pletu, ale z dotazu jsem nabyl dojmu, že Lukáš93 chce jen průsvitné pozadí, opacity způsobí, že bude průsvitný i obsah.
panther
Profil
margin:
i s opacitou se dá udělat, aby bylo průhledné jen pozadí. Jen se s ní musí umět zacházet :-)

Je to další z možností, jak něčeho podobného docílit, pravděpodobně zde bude ale lepší obrázek na pozadí.
joe
Profil
Můžeš to vytvořit i přes CSS, černá barva pozadí, která má 50% průhlednost, nefunguje to však všude, což se dá vyřešit fallbackem.

background: rgb(0,0,0); // fallback - barva zůstane černá, pokud prohlíeč neumí rgba
background: rgba(0,0,0,0.5);
&background: url(background.png); // obrázek pro IE7, kde by bylo průhledné PNG
Chamurappi
Profil
Reaguji na joa:
obrázek pro IE7, kde by bylo průhledné PNG
To už ho může dát rovnou všem.
joe
Profil
Chamurappi:
Proč by to dělal? Ušetří tak načítání jednoho nebo více obrázků a barva se navíc objeví rychleji, než se třeba zobrazí obrázek. A navíc je dobré mít barvu pozadí pod textem :-)
Lukáš93
Profil *
Díky moc. Konečně to dělá to co chci.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: