фоновое изображение не видно в iPad Safari

Question

У меня есть фоновое изображение для поля ввода. Оно отлично работает в IE / FF, но по некоторым причинам оно не видно в iPad Safari. Ниже приведен CSS для того же;

#rightContent  .inputBox{
background:transparent url(images/keyback.gif) no-repeat scroll center 6px;
border:0pt none;
float:left;
height:40px;
#height:37px;
margin-left:10px;
width:450px;
overflow: hidden;
}

Пожалуйста, помогите.Спасибо.

Answer 1

У меня та же проблема, но я обнаружил, что фрагмент изображения, который я использовал, был слишком тонким для отображения на iPad.Это текстура, поэтому я использовал срез 15px и x-repeat, что хорошо для всех браузеров, но не для iPad.После некоторых экспериментов я обнаружил, что порог для iPad составляет 130 пикселей.

Answer 2

Я полагаю, значение по умолчанию background-color является прозрачным. Вы пытались не устанавливать цвет? Кроме того, поскольку у вас установлено изображение без повтора, почему бы не сделать изображение jpg / png и установить цвет, соответствующий желаемому цвету фона.

Answer 3

У меня была такая же проблема, и мне удалось получить рабочее решение с использованием jQuery

    $(document).ready(function () {

        var buttonsFilename = '<%=ResolveUrl("~/Content/Images/Buttons.png") %>';

        $('.commands .command').css({
            background: 'url(' + buttonsFilename + ')',
            width: '55px',
            height: '55px',
            display: 'inline-block'
        });
    });

Я использую это на веб-сайте ASP.NET MVC, отсюда и тег <% %>.

Я мог заставить его работать только с помощью свойства css для ярлыка фона.Я не могу заставить работать любое из следующих ...

• background-image
• backgroundImage
• 'background-image'

... при использовании обозначения объекта.К сожалению, это стирает любые другие настройки фона, которые вы можете иметь.Но я справился с этим, используя другой фрагмент jQuery для установки моего свойства background-position.

Answer 4

Я бы предложил разделить стиль background на отдельные части.Не все браузеры поддерживают transparent (и, возможно, другие части этого стиля).

Когда браузер видит стиль, с которым он не знает, что делать, он обычно игнорирует весь стиль.Помещение background-image в его собственную строку (например, его собственный стиль) позволит этому свойству быть подобранным браузерами, которые могут с ним справиться, вместо того, чтобы упустить его, потому что оно смешано с вещами, о которых браузер не знает.