CSS: Сложность с фоновым положением разных угловых смещений - PullRequest
6 голосов
/ 14 ноября 2011

У меня проблемы с изготовлением кнопок с использованием нескольких фонов. Я знаю, что могу использовать: до и: после, но я хотел бы выяснить это, если это возможно.

Вот Jsfiddle http://jsfiddle.net/syren/qerUT/1/

В этом я показал, как я в конечном итоге хочу, чтобы это выглядело. В этом я использовал

background-position: left top, 97% 90%;

Просто чтобы показать, как я хочу, чтобы это выглядело. Поскольку я хочу, чтобы он имел возможность изящно расширяться для использования для других кнопок и для перевода, я хочу использовать это:

background-position: left top, right 5px bottom 5px;

Но это не работает. Согласно спецификации это должно, так что я не уверен, что я делаю неправильно. Есть идеи? Спасибо!

1 Ответ

4 голосов
/ 14 ноября 2011

Я пытался сделать то же самое.К сожалению, в настоящее время нет реальной поддержки right 5px bottom 5px.

В итоге я взял свое изображение и фактически добавил прозрачные пиксели справа и снизу изображения, чтобы перевести его в положение, в котором я находился.в розыске.Это не красиво, но отлично работает в любом браузере, который поддерживает несколько фоновых изображений.

Полный список функций фона, поддерживаемых каждым браузером, можно найти на странице Standardista CSS3 Background Properties .Под background-position указывается смещение на 4 значения, которое поддерживается только IE9 + и Opera 11+.Это настоящий позор, так как это единственная функция фона CSS3, которая не поддерживается повсеместно.

...