[問題] CSS 背景圖片固定位置與縮放
各位大大好,小弟是新人,剛入門學習基礎前端css。
實作時想要做出下面效果的時候一直卡住,只好請教各位大大m(_ _)m
補充: 我想要的與這遊戲網站的效果一樣
http://ro.gameflier.com/index.asp
---------------------------
還請看示意圖:
http://imgur.com/f2GEaYo

我有一張背景圖,假設1000px。並且中間有個紅色方格區域約800px。
1. 當瀏覽器的瀏覽寬度小於800px的時候:
紅色區域的左邊線可以保持對齊瀏覽器的左邊。
縮放的剪裁區域會從紅色區域右方開始縮減。
2. 當瀏覽器寬度 > 800px ,並且不到1000 px時:
背景圖能平均至中,超出紅格區域的大小也平均分配在瀏覽器兩端。
-----------------------------------
我本來是在中間做一個div,設定寬度800浮動,即可讓內容達到我要的效果,
但是後面背景圖片就沒辦法做到我要的樣子,卡了一天 orz
希望有空的大大能幫我解惑,非常感謝。
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 203.73.234.49
※ 文章網址: https://www.ptt.cc/bbs/Web_Design/M.1465785859.A.6D1.html
→
06/13 10:47, , 1F
06/13 10:47, 1F
→
06/13 10:47, , 2F
06/13 10:47, 2F
看起來很類似,我研究下怎麼把大大東西轉出來用,感謝。
推
06/13 11:31, , 3F
06/13 11:31, 3F
→
06/13 11:31, , 4F
06/13 11:31, 4F
意思是開一層div放背景圖,裡面一層div保持寬度置中即可!?
推
06/14 06:11, , 5F
06/14 06:11, 5F
→
06/14 06:17, , 6F
06/14 06:17, 6F
天阿 您完美的解決了 XDDD 太感謝啦
※ 編輯: KanoLoa (203.73.234.49), 06/14/2016 14:19:05
Web_Design 近期熱門文章
PTT數位生活區 即時熱門文章