CSS3 gradiens támogatása minden böngészőben

CSS3 továbbra is támogatja, hogy a tömegek, és most ráadásul a border-radius és box-shadow, ez már lehetséges, hogy egy gradiens töltse nélkül a külső képeket.
Arról, hogy hogyan kell ezt csinálni, kérjük ossza meg velünk Robert Nyman.

Most megvan a képesség, hogy a fokozatos kitöltések közvetlenül a CSS kód használata nélkül a képeket.

Különbségek szintaktikai és böngésző támogatás

A jó hír az, hogy a böngésző lista, támogatja a CSS színátmenetek áll Firefox, Safari, Google Chrome és az Internet Explorer ( «helyes» Opera megint, mint már mondtam az előző cikkben, már úton van). A rossz hír - ennek megvalósítása a lehetőségét is minden böngésző saját. Abban az esetben, IE használ egy régi megközelítés származó még IE 5.5. Böngészőkre WebKit alapú (Safari és a Google Chrome), aki először támogatja a színátmenetek és használható erre a vászonra, CSS Working Group bemutatta más dialektusok, szintaxis, amely végre a Firefox (és azt hiszem, akkor ő jön, és támogatja a WebKit-ovskih böngészők ).

Tehát van támogatja a CSS színátmenetek számára:

  • Firefox 3.6
  • Safari 4
  • Google Chrome
  • Internet Explorer 5.5

Nézzünk egy példát kód:

Lineáris gradiens fentről lefelé

I - gradiens felülről lefelé, hanem a kép!

Lineáris gradiens balról jobbra

Ez a gradiens folyik balról jobbra, a 70% -a a szélessége az elem. A végső szín után 70% nem fog megfelelően működni az Internet Explorer; FinishX opciók és GradientSize nem vonatkozik a gradiens filter ...

I - gradiens balról jobbra, és nem a kép!

sugaras gradiens

Akkor jó szórakozást, és a sugaras színátmenet! De sajnos, ez a fajta gradiens nem támogatja az Internet Explorer.

Én egy sugaras színátmenet!

Az egyszerű lineáris színátmenetek, ez a megoldás igen alkalmas, valamit használni, egyszerűen azért, mert a CSS. Sajnos, a korlátozások az Internet Explorer nem engedi meg a lehetőséget, hogy élvezze az összes típusú színátmenet teljes mértékben.