InternetWeb Design

Property CSS "Transparenz" - eng einfach Art a Weis um Site méi interessant Design ze maachen

Haut, d'Kreatioun vun Websäit Design gëtt eng Konscht Form. Dat ass net just eng Rei vun Elementer Säit vun engem bestëmmte Faarf a Gréisst, Policen vu verschiddene Stiler an thematesch Biller. Fir äre Site anescht wéi déi aner ze maachen, gaangen auswiesselen ze lackele an et bestëmmte Elementer direkt, benotzt eng grouss Zuel vu Methoden an Instrumenter. Dorënner ass et eng ganz populär Propriétéit CSS - Transparenz. Dës Technik ass ganz moudesch an wonnerschéin, an dofir benotzt gëtt oft. Transparenz ka verschidden Objeten Säiten vum Site ginn - Text blockéiert oder d'ganzt Bild, zum Beispill. Et och a verschiddene Weeër erreecht. Loosse mer se ënnert ënnersicht.

Parameteren uginn d'Elementer vun Transparenz

Parameteren der Transparenz vun Elementer vun e puer ze regléieren. Si sinn op der spezifesch Ziler benotzt je, wéi och de Browser, deen ënner dem "seng" Design ass. Dozou gehéiert den folgenden Eegeschaften:

  • Opazitéit;
  • FILTER;
  • PNG-Bild als Hannergrond.

Property Wäert CSS "Transparenz" geännert gi wéi follegt: déi héich Zuel, déi méi niddreg den Niveau vun Transparenz vun der Element. Der Opazitéit, géréiert hänkt et vun 0 bis 1, an der FILTER - vun 10 bis 100 An ass d'Pai fir Interet Explorer Browser, an all aner applicabel Opazitéit Propriétéit benotzt.

Transparenz Bild (änneren)

Loosst d'mat der Optiounen ufänken dass transparent wäert schéngen, wann Dir de Punkt plënneren vun der Maus Schnéi.

Loosst eis als wéi der Transparenz vum Bild ze uginn. CSS offréiert zwou Méiglechkeeten. Maachen dëst, muss du et direkt am Code HTML-Dokument aschreiwen wéi follegt:

    1. Uginn de Wee an d'Bild.
    2. Mir definéieren d'Parameter vun Transparenz, wann der Cursorpositioun net ass. Fir dëst ze maachen, benotze mir d'Eegeschafte vun der onmouseover an onmouseout, wat de Wäert vun Opazitéit dëser Theorie, an agin.

    Déi selwecht Charakteristiken kann an CSS-Dokument an d'Source Code ze Foto eng Referenz fir se matzebréngen ginn. D'Resultater Tour eraus déi selwecht.

    Transparenz vum Text an Säit Bléck

    Wéi fir den Text oder blockéiere (transparent Divisiounen), CSS seng Optioun bitt, ähnlech zu engem transparent Bild schafen, hutt Dir d'verbonne CSS-Fichier ze benotzen, an deenen de gewënschte Parameteren Formatioun sinn. Du kanns goen an eng einfach Art a Weis. Wann Dir Formatioun der Stil Spär Divisiounen Stil oder Text p prescribe folgend HTML-Code ze onmouseover an onmouseout Elementer. Souwuel Optiounen schaffen an produzéiere dem erhoffte Resultat.

    Transparenz konstante

    An e puer Fäll, d'Transparenz vun engem Objet, engem Design Element oder Text Dir op enger Dräierkoalitioun Basis ze setzen wëllt. An dëser Situatioun, ass d'Léisung och einfach wéi wann Dir der Maus Cursorpositioun hover.

    CSS Element fir Transparenz gëtt vun de folgende Code entscheet ginn. An Spär Divisiounen Stil prescribe Wäerter fir den Hannergrond (e.g., # ff8800), Opazitéit (zB, 0,5) an der Breed (Breet) an padding (padding).

    Fir d'Bild Code Wäerter sinn nees an Opazitéit FILTER, an de Wee bis op d'Bild uginn.

    RGBA-Method

    Et ginn aner Méiglechkeeten fir mat dëser Propriétéit CSS: Transparenz kann zu der Basis Faarf vun all Design Element applizéiert ginn. Et benotzt RGBA Method. Déi éischt dräi Bréiwer stinn fir déi elementar Faarwen (rout, Kärspaltung, blo), an de leschten - Alpha, wat den Niveau vun Transparenz baut. RGBA-Format mat dëser Theorie Transparenz, et bis déi lescht Zuelen Virop. Zum Beispill, wéi: Hannergrond: rgba (240,2,33,0.4035).

    Konklusioun

    Sou, vun am Laf vun der Aarbecht op de Site Design einfach mee efficace Fonktioun CSS "Transparenz" benotzt, kënnt dir et méi interessant a méi datt Elementer mat Minimum Effort maachen. D'beschriwwen däer sinn Mooss Transparenz Fonctiounen Dir mat dëser Hëllef gëtt.

    Similar articles

     

     

     

     

    Trending Now

     

     

     

     

    Newest

    Copyright © 2018 lb.unansea.com. Theme powered by WordPress.