CSS3 продължи да популяризира сред масите, а сега в допълнение към използването на граничен радиус и бокс-сянка, вече е възможно да се използва градиент запълни без използването на външни изображения.
За информация как да направите това, моля споделете ги с нас Робърт Nyman.

Сега имаме възможността да се създават градиент изпълва директно от кода на CSS, без да се използват никакви изображения.

Различията синтаксис и поддръжка на браузъра

Добрата новина е, че списъкът на браузъра, подкрепа CSS градиенти състоят Firefox, Safari, Google Chrome и Internet Explorer ( «правилно» Opera отново, както е казано в предишната статия, е на път). Лошата новина - реализацията на този много възможност за всеки браузър има своя собствена. В случай на IE използва древен подход произход дори и с IE 5.5. За браузъри, базирани на WebKit (Safari и Google Chrome), който за първи път въвежда поддръжка за наклони и да се използва за това платно, Работна група CSS е въвела различни диалекти, синтаксис, който се осъществява в Firefox (и предполагам, че тогава той дойде и подкрепа за WebKit-ovskih браузъри ).

Така че ние имаме подкрепа за CSS градиенти за:

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

Нека разгледаме един пример за код:

Линеен градиент от горе до долу

I - градиент от горе на долу, а не на снимката!

Линейно от ляво на дясно

Този градиент потоци от ляво на дясно, 70% от ширината на елемента. Крайният цвят, след като 70% няма да работи правилно в Internet Explorer; опции FinishX и GradientSize не прилагат градиент филтър ...

I - градиент от ляво на дясно, а не на снимка!

радиална градиент

Можете да се забавлявате и да радиален градиент! Но за съжаление, този тип градиент не се поддържа в Internet Explorer.

Аз съм радиален градиент!

За прости линейни градиенти, това решение е доста подходящ, нещо, за да го използвате, просто защото на CSS. За съжаление, ограниченията на Internet Explorer не позволява възможността да се насладите на всички видове наклони в пълен размер.