#web #css #media
#веб #css #Медиафайлы
Вопрос:
В iPhone 4.0 установлен дисплей retina, веб-изображения можно обновить с помощью background-size свойства CSS3. Пока не все браузеры поддерживают CSS3 (особенно IE), к счастью, у нас есть следующий код, который нам поможет:
@media only screen and (-webkit-min-device-pixel-ratio:2) { }
Но, хотя этот код казался достаточным для своей цели, это не так. Я хотел бы получить такое утверждение, как:
IF BROWSER SUPPORTS BACKGROUND-SIZE THEN { ... } (in CSS)
Почему вы спрашиваете? Samsung Galaxy S также может отображать действительно четкие изображения с размером фона, но у него нет соотношения пикселей 2.0 для запуска CSS.
Кто-нибудь может мне помочь?
Комментарии:
1. Вы хотите сказать, что в настоящее время вы добавляете фон с низким разрешением, а затем заменяете его, если соотношение устройств к пикселям равно 2?
Ответ №1:
Я думаю, что вы ищете библиотеку, подобную modernizr 🙂 Modernizr позволяет определять, поддерживает ли клиент новые функции (особенно css3) или нет.
С помощью простого css вы можете изменить браузер и адаптировать свой код.
Вот часть, которая вам нужна:http://www.modernizr.com/docs/#backgroundsize
О, также, спасибо за ваши советы по сетчатке 😉
Ответ №2:
Среди рабочей группы W3C по CSS обсуждается вопрос о добавлении функциональных запросов в CSS. Предложение состоит в том, чтобы иметь синтаксис в соответствии с этими строками:
@supports ( background-size ) {
...
}
Однако, даже если они будут приняты, пройдет несколько лет, прежде чем эти предложения достигнут браузеров. На данный момент вам лучше воспользоваться подходом modernizr, описанным Тимом.