Фоновые изображения CSS не отображаются на ipad

Я полностью смущен и задаюсь вопросом, не хватает ли я чего-то простого, но я не могу отобразить фоновое изображение на ipad или внутри симулятора ipad.Фоновые изображения CSS не отображаются на ipad

В качестве теста я соединил следующую простую страницу:

<html> 
<head></head> 
<body> 
    <img src="content_box_black_background.png" /> 
    <div style="height: 100px; width: 500px; background:url(content_box_black_background.png);"> 
    </div> 
</body></html>

В качестве теста я также выводить изображение непосредственно над блоком Див. В хроме они оба появляются, но в ipad-симуляторе этого не делают. Есть идеи?

источник

2010-07-23 Benjamin Dell

Если оба они появляются в хроме, и ни появляются в симуляторе, то я не подозреваю, что вы пытаетесь использовать его в качестве «фона» изображение имеет какое-либо отношение к вашей проблеме. Похоже, что симулятор не поднимает путь к изображению. – ScottS

Посмотрите прямо на меня. Я бы попробовал несколько вещей, хотя, может быть, симулятор глючит: url ('content_box_black_background.png'); или url ('./content_box_black_background.png '); –

Какой симулятор iPad? Не могли бы вы добавить ссылку? – Zabba

Я не проверяю их, но у меня есть несколько идей, вы должны проверить:

1) Каким образом файлы, размещенные на «локальном диске» iPad? у вас нет HTTP, поэтому я предполагаю, что у вас есть изображение на жестком диске (RAM) - попробуйте открыть файл непосредственно в браузере, он показывает/загружается?

2) Попытайтесь добавить: "display: block;" к вашему CSS-рендерингу. Мог бы сделать трюк

3) Тег IMG, попробуйте добавить ширину и высоту, что-нибудь изменить?

4) Какой тип PNG-файла вы используете? 8-бит или 24-бит?

5) Что произойдет, если вы используете GIF или JPG?

6) при использовании фоновых изображений. Попробуйте использовать длинный формат для атрибутов. "Фоновое изображение: URL (image.jpg);".

7) Также попробуйте добавить <!DOCTYPE html>, чтобы браузер перешел в режим HTML5.

источник

2010-07-24 00:11:39 BerggreenDK

Спасибо за предложения. Часто он принимает список простых проверок, чтобы помочь разобраться. Я не могу попробовать каждый из предложений, но я уверен, что это будет один из них (скорее всего, формат PNG, который я использовал на определенной графике). Спасибо за ваш вклад. –

ОЗУ - это системная память, тогда как жесткие диски предназначены для хранения файлов - они полностью не связаны друг с другом на разных уровнях. – Christian

@Christian - Я написал «harddrive» как «подобие». Я знаю, какая разница между Flash RAM, RAM, Harddrives и т. Д. Не нужно проголосовать за мой ответ, потому что я сравниваю внутреннее хранилище с жестким диском. То, к чему привыкли большинство людей с обычных компьютеров. Я получил свой первый компьютер еще в 1987 году, поэтому, пожалуйста, поймите, что это было похоже на сходство для сравнения и объяснения. – BerggreenDK

-3

всегда поставить кавычки вокруг URL и либо полный url("http://example.com/folder/file.htm") или, по крайней мере, слэш url("/file.htm")

источник

2010-07-24 00:03:38 isildur4

, если пробелов нет, кавычки НЕ нужны. Сожалею. – BerggreenDK

um, хорошая программирующая привычка? – isildur4

Цитаты совершенно ненужные, если нет пробелов, и это относится и к полному указанию URL, почему вы действительно этого хотите? CSS читает правду url на свой собственный путь. И.Е. Если ваш * .css * находится внутри '/styles' и изображений внутри' /styles/images', вы должны использовать url в CSS, например 'url (images/ .extension)', и это сработает отлично! – jolt

Это может быть связано с размерами изображения. В Safari Web Content Guide упоминается, что максимальный размер изображений GIF, PNG и TIFF составляет 3 мегапикселя (3 * 1024 * 1024). Я столкнулся с аналогичной проблемой, отображающей меню, основанное на CSS спрайтах. Мне пришлось сжать довольно крупное изображение (3000x1500), прежде чем какой-либо из спрайтов появится на iPad.

источник

2010-11-04 16:09:37 timbonicus

эта проблема решена с моим сайтом ipad - спасибо большое :) – boz

У меня была такая же проблема. Если вы используете спрайт, убедитесь, что его ширина и высота минимальны. Мой размер спрайта составлял всего около 130 тыс., И iPad 2 не показывал его, поскольку ширина составляла 4000 пикселей. – Shahar

Удостоверьтесь, что у вас есть действующий CSS! http://jigsaw.w3.org/css-validator/

Я столкнулся с этой проблемой раньше и подтвердил/исправил мой CSS исправил ее!

источник

2011-02-06 14:00:43

В некоторых настройках для мобильных устройств вы найдете «сжимать большие изображения в сообщениях или страницах, чтобы они помещались на более мелкие экраны». проверить, разрешить или запретить его. И отключите его.

Надеюсь, что это решит вашу проблему.

источник

2013-01-01 06:40:03

IPAD не нравится cover в сокращении фона. Если вы используете крышку сделать это на новой линии

-webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover;

источник

2013-08-06 11:53:03 Rick

Фоновые изображения CSS не отображаются на ipad

ответ

Смежные вопросы