Kiinteistövälitys css "avoimuus" - yksinkertainen tapa tehdä sivustosta mielenkiintoisempia suunnittelu

Nykyään luominen sivuston suunnittelu tulee taidemuoto. Tämä ei ole vain joukko sivun elementit tietyn värin ja koon, fontit eri tyylejä ja temaattista maalauksia. Jotta sivuston erilainen kuin muut, houkutella kävijöitä huomiota ja ohjaamaan tiettyjä elementtejä, käytetty valtava määrä menetelmiä ja työkaluja. Niiden joukossa on erittäin suosittu ominaisuus css - avoimuutta. Tämä tekniikka on varsin muodikasta ja kiinnostavaa, ja näin ollen sitä käytetään usein. Avoimuus voi antaa erilaisia esineitä sivuston sivuilla - tekstin estää tai koko kuvan, esimerkiksi. Se saavutti myös eri tavoin. Tarkastellaan niitä alla.

Parametrit määrittää avoimuuteen liittyviä näkökohtia

Parametrit säännellä avoimuuden elementtejä useita. Niitä käytetään riippuen erityisiä tavoitteita, sekä selain, joka on alle "säätää" design. Näihin kuuluvat seuraavat ominaisuudet:

• opasiteetti;
• suodatin;
• PNG-kuvan taustalla.

Omaisuuden arvo css "läpinäkyvyyttä" muutetaan seuraavasti: mitä suurempi luku, sitä pienempi avoimuuden elementin. Opasiteetti, se vaihtelee 0-1, suodattimen - 10 100. Ja tämä käytetään INTERET Explorer selaimen, ja kaikki muut soveltaa opasiteetti omaisuutta.

Avoimuus Image (muuttuva)

Aloitetaan vaihtoehdot on läpinäkyvää, kun siirrät kohteen vetämällä hiirellä.

Mietitäänpä, miten määritetään läpinäkyvyyttä kuvan. CSS on kaksi vaihtoehtoa. Voit tehdä tämän, sinun täytyy rekisteröityä suoraan koodissa html-asiakirjan seuraavasti:

1. Määritä polku kuvan.
2. Määrittelemme parametrit avoimuutta kohdistin ei ole. Tehdä tämän, käytämme ominaisuudet onmouseover ja onmouseout, jossa säädetään arvo opasiteetti, ja suodatin.

Samoja ominaisuuksia voidaan määrätä CSS-asiakirjassa ja lähdekoodi lisätä viittaus siihen. Tulokset osoittautuvat sama.

Läpinäkyvyyttä tekstin ja sivun lohkot

Kuten tekstin tai lohkon (läpinäkyvä div), css tarjoaa vaihtoehdon, samanlainen luoda avoin kuva, sinun on käytettävä kytketty css-tiedosto, jossa halutut parametrit on asetettu. Voit mennä ja yksinkertaisempi tapa. Kun asetat tyyli lohko div style tai tekstiä p säädettävä seuraavasta html-koodin onmouseover ja onmouseout elementtejä. Molemmat vaihtoehdot toimivat ja tuottavat toivotun tuloksen.

avoimuus jatkuva

Joissakin tapauksissa, läpinäkyvyyttä objektin, ulkoasun tai tekstiä haluat asettaa jatkuvasti. Tässä tilanteessa ratkaisu on jopa helpompaa kuin, kun viet hiiren osoittimen.

Css osa avoimuudesta annetaan seuraavalla koodilla. Lohkossa div style määrätä arvot tausta (esimerkiksi # ff8800), sameus (esimerkiksi, 0,5) ja leveys (leveys) ja täyte (täyte).

Jotta kuvan koodi arvot tekevät ja opasiteetti suodatin, ja määrittää polun kuvan.

RGBA-menetelmä

On muitakin vaihtoehtoja omaisuuden käyttöön CSS: avoimuus voidaan soveltaa pohjaväri tahansa ulkoasun. Se käyttää RGBA menetelmää. Kolme ensimmäistä kirjainta vastaavat perusvärejä (punainen, fissio, sininen), ja viimeinen - alfa, joka asettaa avoimuutta. Käyttämällä RGBA-formaatin määrää avoimuutta osoittaen sen viimeisen numeron. Esimerkiksi: tausta: RGBA (240,2,33,0.4035).

johtopäätös

Näin käyttämällä aikana töitä sivuston ulkoasu yksinkertainen mutta tehokas ominaisuus css "avoimuus", voit tehdä siitä kiinnostavamman ja selvemmin elementtejä vähällä vaivalla. Kuvatut suoritusmuodot ovat mukautettuja läpinäkyvyys ominaisuudet auttavat sinua tässä.