Property CSS "transparânsje" - in ienfâldige manier om de site nijsgjirriger design

Hjoed, de oprjochting fan 'e webside ûntwerp wurdt in keunstfoarm. Dit is net allinnich in set fan side eleminten fan in bepaalde kleur en grutte, lettertypen fan ferskillende stilen en tematyske skilderijen. Om te meitsje dyn side oars fan oaren, te lûken besikers 'oandacht en direct it nei bepaalde eleminten, brûkt in grutte oantal metoaden en ark. Under harren is der in hiel populêre eigendom CSS - transparânsje. Dizze technyk is frij modieuze en glamoureuze, en dêrom wurdt brûkt faak. Transparânsje kin jaan ferskillende foarwerpen siden fan de webside - tekst blok of de hiele foto, bygelyks. It ek berikt yn ferskillende wizen. Lit ús ûndersykje se hjirûnder.

Parameters spesifisearje de eleminten fan transparânsje

Parameters om te regeljen de transparânsje fan de eleminten fan de ferskate. Se wurde brûkt ôfhinklik fan de spesifike doelen, en ek de browser, dat is ûnder de "oanpast" design. Dy binne ûnder oare de folgjende eigenskippen:

• dekking;
• filter;
• PNG-ôfbylding as eftergrûn.

Property wearde CSS "transparânsje" wurde feroare lykas folget: wat heger it nûmer, hoe leger it nivo fan transparânsje fan it elemint. De dekking, dat fariearret fan 0 oant 1, yn it filter - fan 10 oant 100. En dat lêste wurdt brûkt foar intérêt Explorer blêder, en alle oare tapassing dekking eigendom.

Transparânsje Image (wikseljende)

Lit ús begjinne mei de opsjes dy't sil ferskine trochsichtich as jo ferpleatse it item troch te slepen op de mûs.

Nim no hoe't opjaan de transparânsje fan de ôfbylding. CSS biedt twa opsjes. Om dat dogge moatte registrearje it direkt yn de koade HTML-dokumint as folget:

1. Jou hjir it paad nei de ôfbylding.
2. Wy beskiede hoe de parameters fan transparânsje as de kursor net. Om do dit, wy brûke de eigenskippen fan 'e onmouseover en onmouseout, dy't prescribes de wearde fan' e dekking, en filter.

Deselde skaaimerken kinne wurde foarskreaun yn CSS-dokumint en de boarnekoade te heakjen in ferwizing nei it. De resultaten keare út itselde.

Transparânsje fan tekst en side blokken

As foar de tekst of blok (transparante div), css biedt syn opsje, te ferlykjen mei it meitsjen fan in transparant byld, jim moatte gebrûk meitsje fan de ferbûn CSS-triem, wêryn de winske parameters binne ynsteld. Jo kinne gean en in ienfâldiger wize. Wannear't jo sette de styl block div style of tekst p schrijven de neikommende HTML-koade te onmouseover en onmouseout eleminten. Beide opsjes wurkje en produsearje it winske resultaat.

transparânsje konstant

Yn guon gefallen, de transparânsje fan in foarwerp, in ûntwerp elemint of tekst dy't jo wolle set op in trochgeand basis. Yn dizze situaasje, de oplossing is noch ienfâldiger dan as jo de mûs de mûsoanwizer.

CSS elemint foar transparânsje sil jûn wurde troch de folgjende koade. Yn block div style foarskriuwen wearden foar de eftergrûn (bgl, # ff8800), dekking (bygelyks, 0.5) en de breedte (breedte) en padding (padding).

Foar it byld koade wearden wurde meitsjen en dekking filter, en spesifisearje it paad oan de ôfbylding.

RGBA-metoade

Der binne oare mooglikheden foar it brûken fan dizze eigendom CSS: transparânsje kin tapast oan de basis kleur fan in ûntwerp elemint. It brûkt RGBA metoade. De earste trije letters steane foar de basis kleuren (read, fission, blau), en de lêste - alfa, dat bepaalt it nivo fan transparânsje. It brûken RGBA-formaat prescribes transparânsje, wiist it oan de lêste sifer. Bygelyks, as: eftergrûn: rgba (240,2,33,0.4035).

konklúzje

Sa, troch te brûken yn 'e rin fan it wurk op de site design ienfâldich mar effektyf funksje CSS "transparânsje", kinne jo meitsje it nijsgjirriger en mear fernimmen eleminten mei sa min mooglik ynspanning. De beskreaune embodiments binne oanpaste transparânsje funksjes sille helpe jo mei dizze.