Vlastnosť css "transparentnosť" - jednoduchý spôsob, ako z lokality viac zaujímavý dizajn

V súčasnej dobe je tvorba dizajnu webových stránok sa stáva umeleckú formu. To nie je len súbor prvkov stránky určité farby a veľkosti, písma rôznych štýlov a tematických obrazov. Aby bol váš web sa líši od ostatných, prilákať pozornosť návštevníkov a riadiť ho na určité prvky, používa veľké množstvo metód a nástrojov. Medzi nimi je veľmi populárny vlastnosť css - transparentnosť. Táto technika je veľmi módne a elegantné, a preto sa používa často. Transparentnosť môže dať rôzne objekty stránky webu - textového bloku alebo celého obrazu, napríklad. To tiež dosiahnuť rôznymi spôsobmi. Poďme preskúmať ich nižšie.

Parametre určujú prvky transparentnosti

Parametre pre reguláciu transparentnosti prvkov niekoľko. Sú používané v závislosti od konkrétnych cieľov, rovnako ako prehliadač, ktorý je v rámci "očistené" dizajn. Patrí medzi ne nasledujúce vlastnosti:

• nepriehľadnosť;
• filter;
• PNG-image ako pozadie.

Hodnota vlastnosti css "transparentnosť" sa mení a dopĺňa takto: čím vyššie číslo, tým nižšia je úroveň transparentnosti prvku. Nepriehľadnosť, sa pohybuje od 0 do 1, vo filtri - od 10 do 100. A druhý je používaný pre intérêt Exploreru, a všetky ostatné platné krytie majetku.

Priehľadnosť obrazu (zmena)

Začnime s možnosťami, ktoré sa objavia transparentné pri presunutí položky ťahaním myši.

Uvažujme, ako určiť priehľadnosť obrazu. CSS ponúka dve možnosti. Ak to chcete vykonať, je nutné ho zaregistrovať priamo v kóde HTML dokumente takto:

1. Zadajte cestu k obrázku.
2. Definujeme parametre transparentnosti, ak kurzor nie je. Ako to dosiahnuť, používame vlastnosti onmouseover a onmouseout, ktorý predpisuje hodnotu nepriehľadnosti a filtrom.

Rovnaké charakteristiky môžu byť predpísané v css-dokumente a zdrojový kód pridať odkaz na to. Výsledky dopadne rovnako.

Priehľadnosť textu a stránok blokov

Čo sa týka textu alebo bloku (transparentné div), css ponúka svoju voľbu, podobne ako k vytvoreniu transparentného obrazu, budete musieť použiť pripojený CSS súbor, v ktorom sú nastavené požadované parametre. Môžete ísť a jednoduchší spôsob. Ak nastavíte div style style bloku alebo textu p predpísať nasledujúci html kód onmouseover a onmouseout prvkov. Obe možnosti pracovať a produkovať požadovaný výsledok.

priehľadnosť konštantný

V niektorých prípadoch, priehľadnosť objektu, dizajnový prvok alebo text, ktorý chcete nastaviť priebežne. V tejto situácii riešením je ešte jednoduchšie, ako keď podržíte kurzor myši.

Css prvkom pre transparentnosť bude daná nasledujúci kód. V bloku div style predpísať hodnoty pozadia (napr., # Ff8800), opacita (napr, 0,5) a šírkou (šírka) a výplň (padding).

Pre obraz hodnoty kódov robia a nepriehľadnosť filter a zadajte cestu k obrázku.

RGBA metóda

Existujú aj iné možnosti použitia tohto majetku css: transparentnosť možno aplikovať na základnej farbe akéhokoľvek dizajnovým prvkom. Používa metódu RGBA. Prvé tri písmená znamenajú základných farieb (červená, štiepenie, modrá), a posledný - alfa, ktorý nastavuje úroveň transparentnosti. Používanie RGBA-formát predpisuje transparentnosť, namieril ju na poslednú číslicu. Napríklad, ako: pozadia: RGBA (240,2,33,0.4035).

záver

Tým, že použitie v priebehu prác na dizajn miesta jednoduchý, ale účinný funkcia css "transparentnosť", môžete robiť to viac zaujímavejšie a výraznejšie prvky s minimálnym úsilím. Popísaná prevedenia sú vlastné funkcie transparentnosti vám pomôže s tým.