Css proprietate „transparență“ - un mod simplu de a face site-ul mai interesant de design

Astăzi, crearea de design site-ul devine o formă de artă. Aceasta nu este doar un set de elemente de pagini de o anumită culoare și dimensiune, fonturi de diferite stiluri și picturi tematice. În scopul de a face site-ul dvs. diferit de ceilalți, pentru a atrage atenția vizitatorilor și direcționeze către anumite elemente, a folosit un număr foarte mare de metode și instrumente. Printre ei există o css proprietate foarte popular - transparență. Aceasta tehnica este destul de la modă și plin de farmec, și, prin urmare, este folosit de multe ori. Transparența poate oferi diferite obiecte de pagini ale site-ului - blocul de text sau imaginea de ansamblu, de exemplu. De asemenea, realizat în diferite moduri. Să le examinăm mai jos.

Parametrii specificați elementele de transparență

Parametrii pentru a reglementa transparența elementelor de mai multe. Acestea sunt utilizate în funcție de obiectivele specifice, precum și browser-ul, care se află sub „ajustat“ design. Acestea includ următoarele proprietăți:

• opacitate;
• se filtrează;
• PNG-imagine ca fundal.

Proprietatea Valoarea css „transparență“, se modifică după cum urmează: cu cât numărul, cu atât este mai scăzut nivelul de transparență al elementului. Opacitatea, acesta variază de la 0 la 1, în filtru - de la 10 la 100. Iar acesta din urmă este utilizat pentru browser-ul Interet Explorer, și toate celelalte proprietăți de opacitate aplicabile.

Transparență Image (schimbare)

Să începem cu opțiunile care vor apărea transparente atunci când mutați elementul prin glisarea mouse - ul.

Să luăm în considerare modul în care să se specifice transparența imaginii. CSS oferă două opțiuni. Pentru a face acest lucru, trebuie să se înregistreze direct în codul HTML documentul după cum urmează:

1. Specificați calea imaginii.
2. Noi definim parametrii de transparență atunci când cursorul nu este. Pentru aceasta, folosim proprietățile onMouseover și onmouseout, care prevede valoarea de opacitate, și se filtrează.

Aceleași caracteristici pot fi prescrise în css document și codul sursă pentru a adăuga o trimitere la acesta. Rezultatele se dovedesc la fel.

Transparența de blocuri de text și pagini

În ceea ce privește textul sau blocul (div transparent), css oferă opțiunea sa, similar cu crearea unei imagini transparente, trebuie să utilizați fișierul css-conectat, în care sunt stabilite parametrii doriți. Puteți merge și un mod mai simplu. Când setați stilul de div bloc de stil sau de text p prescrie următorul cod HTML-cod pentru onMouseOver și onMouseOut elemente. Ambele opțiuni funcționează și pentru a produce rezultatul dorit.

constantă transparență

În unele cazuri, transparența unui obiect, un element de design sau textul pe care doriți să setați în mod continuu. În această situație, soluția este chiar mai simplu decât atunci când treceți cursorul mouse-ului.

Element de transparență Css va fi dată de următorul cod. În stilul div bloc prevăd valori pentru fundal (de exemplu, # ff8800), opacitatea (de exemplu, 0,5) și lățimea (lățime) și padding (padding).

Pentru imaginea valori de cod se face și se filtrează opacitate, și specificați calea către imagine.

RGBA metodă

Există și alte opțiuni pentru utilizarea acestui css proprietate: transparența pot fi aplicate la culoarea de bază a oricărui element de design. Se folosește metoda RGBA. Primele trei litere reprezintă culorile de bază (roșu, fisiune, albastru) și ultima - alfa, care stabilește nivelul de transparență. Utilizarea RGBA format prevede transparență, arătând că la ultima cifră. De exemplu, ca: fundal: RGBA (240,2,33,0.4035).

concluzie

Astfel, prin utilizarea în cadrul lucrărilor pe site-ul de design simplu, dar eficient caracteristica css „transparență“, puteți face mai multe elemente cu un efort minim interesant și mai ușor de remarcat. Variantele de realizare descrise sunt funcții personalizate de transparență vă va ajuta cu acest lucru.