Phonegap css background image dpi

Question

Я создаю приложение phonegap для ios, и у меня возникают проблемы с фонов изображения css. Скажем, например, что у меня есть div, который охватывает более 100% окна просмотра. Я хочу использовать изображения реального разрешения для улучшения пикселя.

<div class="main"></div> 
<style> 
.main { 
width: 100% 
height: 100%; 
background: transparent url('640×1136.jpg') 
} 
</style> 

Так что в основном я хочу отобразить изображение 640 × 1136 в качестве фона. Но область просмотра всегда имеет ширину 320 пикселей, делая фоновое изображение растянутым.

Могу ли я каким-то образом использовать веб-представление вместо реальных пикселей?

Answer 1

Вы можете использовать атрибут фон-размер:

background-size: contain 

или:

background-size: cover 

У Вас есть дополнительная информация в "Background-size"

Answer 2

У меня возникла подобная проблема при разработке приложения PhoneGap. Попробуйте ниже решения.

Добавить следующий метатег в HTML.

<meta name=\"viewport\" content=\"target-densitydpi=device-dpi\" /> 

Надеюсь, это поможет вам.