科爾多瓦的背景或多個背景使用一個大的圖像？

我正在爲iOS和Android構建一個Cordova應用程序，所以自然有很多不同的屏幕尺寸。科爾多瓦的背景或多個背景使用一個大的圖像？

我的一些意見有一個完整的背景圖片。我的問題是：

是更好地使用一個大的圖像，將覆蓋最大的潛在設備，並只用於所有設備，或使用大量不同的圖像，使用媒體查詢將每個圖像分配給正確的設備？

只是在這裏尋找最佳實踐。

來源

2016-08-11 Mr.P

我推薦您用一個cover，百分比或viewport背景CSS大小組合的形象是2732×2048（最大的iPad screen size今天）。例如：

http://play.ionic.io/app/094f73be9047

CSS

ion-content { 
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/6/6c/Keeny-creek-wv-autumn-waterfall-scenery_-_West_Virginia_-_ForestWander.jpg); 
    background-size: cover; 

    text-align: center; 
} 

ion-content p { 
    padding: 20px 0; 
    color: white; 
    font-weight: 100; 
    font-size: xx-large; 
}

HTML

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 
    <link href="https://code.ionicframework.com/1.0.0/css/ionic.min.css" rel="stylesheet"> 
    <script src="https://code.ionicframework.com/1.0.0/js/ionic.bundle.js"></script> 
    </head> 
    <body ng-app="app"> 
    <ion-pane> 
     <ion-header-bar class="bar-positive" class="bar-stable"> 
     <h1 class="title">Awesome App</h1> 
     </ion-header-bar> 

     <ion-content class="padding"> 
     <p>I am so beautiful</p> 
     <button class="button button-positive">I'm a button</button> 
     </ion-content> 

    </ion-pane> 
    </body> 
</html>

來源

2016-08-11 15:11:16 Lightbeard

你有辦法將該圖像用作圖案。這樣做，你將不會有不同的屏幕尺寸問題。

來源

2016-08-11 14:44:44 Chronos

科爾多瓦的背景或多個背景使用一個大的圖像？

回答

相關問題