Ejendom css "gennemsigtighed" - en enkel måde at gøre området mere interessant design

I dag, oprettelse af hjemmeside design bliver en kunstform. Dette er ikke blot et sæt af sideelementer i en bestemt farve og størrelse, skrifttyper af forskellige stilarter og tematiske malerier. For at gøre dit websted forskellig fra andre, for at tiltrække besøgendes opmærksomhed og dirigere den til visse elementer, der anvendes et stort antal metoder og værktøjer. Blandt dem er der en meget populær ejendom css - gennemsigtighed. Denne teknik er på mode og glamourøse, og derfor bruges ofte. Gennemsigtighed kan give forskellige objekter sider på webstedet - tekstblok eller hele billedet, f.eks. Det er også opnås på forskellige måder. Lad os undersøge dem nedenfor.

Parametre specificere enkelthederne i gennemsigtighed

Parametre for at regulere gennemsigtigheden af elementer af flere. De bruges afhængigt af de specifikke mål, samt browseren, som er under "justeret" design. Disse omfatter de følgende egenskaber:

• opacitet;
• foretage;
• PNG-billede som baggrund.

Ejendomsværdi css "åbenhed" er ændret således: jo højere tal, jo lavere niveau af gennemsigtighed af elementet. Den uigennemsigtighed, det varierer fra 0 til 1, i filteret - fra 10 til 100. Og sidstnævnte bruges til Interet Explorer-browser, og alle andre gældende opacitet ejendom.

Gennemsigtighed Image (skiftende)

Lad os starte med de muligheder, der vises gennemsigtigt, når du flytter elementet ved at trække musen.

Lad os overveje, hvordan du angiver gennemsigtigheden af billedet. CSS tilbyder to muligheder. For at gøre dette, skal du registrere det direkte i koden html-dokument på følgende måde:

1. Angiv stien til billedet.
2. Vi definerer parametrene for gennemsigtighed, når markøren er ikke. For at gøre dette, bruger vi egenskaberne for onmouseover og onMouseOut, som foreskriver værdien af uigennemsigtighed, og filter.

De samme egenskaber kan ordineres i css-dokument og kildekoden for at tilføje en henvisning til det. Resultaterne viser sig det samme.

Gennemsigtighed i tekst og side blokke

Med hensyn til tekst eller blok (gennemsigtig div), css tilbyder sin option, svarer til at oprette et gennemsigtigt billede, du er nødt til at bruge den tilsluttede css-fil, hvor de ønskede parametre er indstillet. Du kan gå og en enklere måde. Når du indstiller den stil blok div style eller tekst p ordinere følgende html-kode til onmouseover og onMouseOut elementer. Begge muligheder arbejde og producere det ønskede resultat.

gennemsigtighed konstant

I nogle tilfælde, gennemsigtigheden af et objekt, et design element eller tekst, du vil indstille løbende. I denne situation, er løsningen endnu enklere end når du holder musemarkøren.

Css element for gennemsigtighed vil blive givet ved følgende kode. I blok div style ordinere henblik baggrunden (fx # ff8800), opacitet (fx 0,5) og bredden (bredde) og polstring (padding).

For billedet kodeværdier gør og opacitet filter, og angive stien til billedet.

RGBA-metode

Der er andre muligheder for at bruge denne ejendom css: gennemsigtighed kan anvendes til grundfarven af ethvert design element. Det bruger RGBA metode. De tre første bogstaver står for de grundlæggende farver (rød, fission, blå), og den sidste - alfa, der sætter niveauet for gennemsigtighed. Brug RGBA-format foreskriver gennemsigtighed, peger det til det sidste ciffer. For eksempel som: baggrund: RGBA (240,2,33,0.4035).

konklusion

Ved således at anvende i forbindelse med arbejdet på sitet design enkel, men effektiv funktion css "gennemsigtighed", kan du gøre det mere interessant og mere mærkbar elementer med en minimal indsats. De beskrevne udformninger er brugerdefinerede gennemsigtighed funktioner vil hjælpe dig med dette.