大家好我有個 CSS 問題感覺很困惑！
今天我有一個專案，他有一個區塊，上面的按鈕與標題幾乎所有元素設計師都是給圖檔～
並且隨著不同的裝置這些元素都要因應不同的裝置調整大小～
我使用了兩個方式：
第一種方式：將這個區塊的背景圖直接在最外層的 content 設 background-img
第二種方式：將背景圖直接放在 class=“background” 的 img 標籤內，接著將 wrap 使用絕對定位在 background 上面。
這個畫面還有一個需求，就是在不同的尺寸背景圖是會換的～
如果採用第二種方式，那就要在不同的裝置使用 display:none; 來隱藏不需要顯示的背景圖！
另外還有一點我原本以為我把背景圖設在在 content 的 background-img 這樣裡面的東西就會撐滿高度，但為什麼還要在 content 設固定高 height: 200px; 才會撐起高度呢？
總之我目前這樣的寫法在 768px 的尺寸雖然有換圖了，但是整個背景圖是沒有完整顯示出來的？
總之不知道是太久沒寫 RWD 還是最近腦袋卡住，對於這個畫面的處理一直處理不好，不知道大家對於這樣的設計稿有什麼比較好的處理方式呢？
我的程式源碼
https://codepen.io/hong-wei/pen/PojpjWV?editors=1100
.content的background-size为100% 100%，图片就显示全了
背景图片不会影响盒子宽高，你根据设计稿给盒子宽高就行
看着这繁体字，直接劝退。。。。。