Синтакса вишеструких позадина - ЦСС-трикови

Anonim

Прегледачи који подржавају више позадина (ВебКит од најранијих дана, Фирефок 3+) користе синтаксу попут ове:

#box ( background: url(icon.png.webp) top left no-repeat, url(texture.jpg.webp), url(top-edge.png.webp) top left repeat-y; )

Вредности су одвојене зарезом и може их бити колико год желите са различитим вредностима УРЛ-а, позиционирања и понављања. Можете чак и комбиновати градијенте ВебКит-а у комбинацију:

#box ( background: url(… /images/arrow.png.webp) 15px center no-repeat, -webkit-gradient(linear,left top,left bottom,color-stop(0, #010101),color-stop(1, #181818)); )

Олд сцхоол ИЕ на Мац-у би приказао прву позадину на листи, али други прегледачи који га не подржавају тешко успевају и једноставно не приказују позадину. То га чини тешким случајем за прогресивно побољшање. Односно, ако не користите алатку попут Модернизр-а да бисте открили подршку за њега и написали резервни селектор који декларише само једну позадину за прегледаче који га не подржавају.