Aoao e uiga i le CSS3 Opacity

Faʻamalamalamaina o ou Talaaga

O se tasi o mea e mafai ona faigofie ona e faia i le mamanu lolomi ae le o luga o le Upega o loo ufiufi ia tusitusiga i luga o se ata po o se lanu lanu, ma suia le manino o lena ata ina ia o ese le tusitusiga i tua. Ae o loʻo i ai se meatotino i le CSS3 o le a mafai ai e oe ona suia le opacity o au elemene ina ia lafoaʻi i totonu ma fafo: opacity.

Auala e Faʻaaoga ai le Opacity Property

O le meatotino opacity e taua ai le tau o le manino mai le 0.0 i le 1.0.

0.0 o le 100% manino-soo se mea oi lalo o lena elemene o le a faʻaalia atoatoa. 1.0 e 100% opapa-e leai se mea i lalo o le elemene o le a faʻaalia mai.

O lea ia seti se elemene i le 50% manino, e te tusia:

Opacity: 0.5;

Vaʻai nisi o faʻataʻitaʻiga o le gasegase i gaioiga

Ia mautinoa e tofo i suʻesuʻega matutua

Leai 6 poʻo le 7 o loʻo lagolagoina le CSS3 o le opacity property. Ae e te le o manuia. Nai lo lena, o loʻo oʻu lagolagoina le faʻamafaʻiina o le fatu alpha o Microsoft-only. Alefa i le IE talia fuainumera mai le 0 (manino atoatoa) i le 100 (atoatoa opaque). O le mea lea, ina ia maua lau malamalama i le IE, e tatau ona e faateleina lau opacity i le 100 ma faʻaopopo se faʻamaufaitaimi o le alphafa i au sitaili:

faamama: alpha (opacity = 50);

Vaʻai faʻamafa i le gaioiga (IE naʻo)

Ma Faʻaaogā Muamua Faʻamatalaga Tausi

E tatau ona e faʻaaogaina le -moz-and -webkit-prefixes ina ia lagolagoina ai e matua o Mozilla ma Webkit browsers:

-o gaioiga-opacity: 0.5;
-oz-opacity: 0.5;
Opacity: 0.5;

Faʻamuamua le muai faʻaupuga o le masini, ma le meatotino CSS3 aoga mulimuli.

Suʻe faʻasologa o masini suʻesuʻe i older Mozilla ma Webkit browsers.

E Mafai ona E Faia ni Ata Faʻaalia Tonu

Seti le opacity i luga o le ata lava ia ma o le a mou atu i tua. E aoga tele lenei mea mo ata i tua .

Ma afai e te faʻaopopo i totonu o se taula taula e mafai ona e fatufatuina faʻamaʻi manuia e ala i le suia o le opacity o le ata.

a:
faamama: alpha (opacity = 50)
faamama: progid: DXImageTransform.Microsoft.Alpha (opacity = 50)
-oz-opacity: 0.5;
-o gaioiga-opacity: 0.5;
Opacity: 0.5;
}

E aafia ai lenei HTML:

Suʻe suʻega ma luga o le HTML i faʻatinoga.

Tuu le Tusitusiga i ou Ata

Faʻatasi ma le opacity, e mafai ona e tuʻuina atu le faʻamatalaga i luga o se ata ma faʻaalia le foliga o le a mou ese mai le mea o loʻo i ai lena tusitusiga.

O lenei metotia o se mea leaga tele, aua e le mafai ona e faʻamalo ese le ata, aua o le a maeʻa atoa le ata. Ma e le mafai ona e faʻamalo le pusa o faʻamaumauga , aua o le a maeʻa foi le tusiga iina.

  1. Muamua e te faia se atigipusa VAE ma tuu lau ata i totonu:

  2. Mulimuli i le ata ma se VIV se avanoa-o le mea lea e te faia manino.


  3. O le mea mulimuli e te faaopoopoina i lau HTML o le VIV ma lau tusitusiga i totonu o lau HTML:



    O laʻu taifau Shasta. E le lelei o ia!
  4. E te faʻatusaina i le tulaga o le CSS, e tuʻu ai le tusitusiga i luga o le ata. Sa ou tuʻu laʻu tusi i le itu tauagavale, ae mafai ona e tuʻuina i le taumatau e ala ile suia o le itu tauagavale: 0; meatotino e saʻo: 0; .
    #image {
    tulaga: tagata aiga;
    lautele: 170px;
    maualuga: 128px;
    tuaoi: 0;
    }
    # Numera {
    tulaga: faʻamaoni;
    luga: 0;
    tauagavale: 0;
    lautele: 60px;
    maualuga: 118px;
    talaaga: #fff;
    paʻu: 5px;
    }
    # Numera {
    faamama: alpha (opacity = 70);
    faamama: progid: DXImageTransform.Microsoft.Alpha (opacity = 70);
    -oz-opacity: 0.70;
    Opacity: 0.7;
    }
    #words {
    tulaga: faʻamaoni;
    luga: 0;
    tauagavale: 0;
    lautele: 60px;
    maualuga: 118px;
    talaaga: manino;
    paʻu: 5px;
    }

Vaʻai pe faapefea ona foliga