使用圖像作爲背景或創建CSS，利弊

我正在使用jQuery Mobile和Phonegap的HTML5移動應用程序。它將被部署在多個平臺上。使用圖像作爲背景或創建CSS，利弊

我得到了旗下巴布亞新幾內亞：

enter image description here

我的問題是：

1）直接使用此圖片作爲背景或使用CSS來動態生成一個，哪種方式更好？（就應用程序的速度和用戶體驗而言）

2）如果CSS是一種更好的方法，如何使橫幅的高度與橫幅內的文本內容一起動態增長？（不知道如何處理裝飾）

任何指針，將不勝感激。

您可能會考慮使用SVG來獲得最小尺寸的最佳外觀：http://caniuse.com/svg儘管初始設置會更復雜。 –

1）CSS在技術上可能是更高效的方法，因爲它純粹是代碼，不需要引用其他文件。然而，我並不認爲效率的提高足以讓你不必再花費在CSS中重新創建類似的東西。換句話說，就是使用圖像文件。 PhoneGap用於HTML。圖像在HTML文件中很常見，所以我不擔心它。

2）也許我不明白你在問什麼，但不應該只能使用填充？

<div style = "background-color: red; padding: 25px;"> Banner Text </div> 
<!-- Don't use this type of styling in practice, it's bad technique. -->

希望這回答了你的問題。

2014-04-04 03:51:02 Bloo

他將能夠使用填充？這不是一個可重複的圖像，所以當內容超過圖像的高度時會發生什麼？（我對移動應用程序開發有0個想法，所以我不知道是否有任何實際發生的機會）。 –

這就是我很困惑的，誠實。如果他想嘗試CSS選項，我不知道他的期望會是什麼。短語「使用CSS動態生成一個」推斷，對我來說，它不會試圖一定要複製這個圖像。因此，超過圖像高度的內容不應該成爲問題，因爲圖像不會成爲該選項的一個因素。 – Bloo

好吧，可能他是在談論實際上用css創建邊框，就像css的形狀一樣（我看到了一個帖子，作者用純css製作了一組完整的圖形），那麼我猜padding不會有問題。 –

回答