作者KanoLoa (卡)
看板Web_Design
标题[问题] CSS 背景图片固定位置与缩放
时间Mon Jun 13 10:44:15 2016
各位大大好，小弟是新人，刚入门学习基础前端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://webptt.com/cn.aspx?n=bbs/Web_Design/M.1465785859.A.6D1.html
看起来很类似，我研究下怎麽把大大东西转出来用，感谢。
3F：推 Frozenmouse: 昨天刚好有弄到类似的东西…最後是外层再包个满版div 06/13 11:31
4F：→ Frozenmouse: ，把背景移到外面那层，内层的保持宽度并置中来解决 06/13 11:31
意思是开一层div放背景图，里面一层div保持宽度置中即可！？
6F：→ Frozenmouse: 不确定符不符合你要的XD 外面放背景的也要设最小宽度 06/14 06:17
天阿 您完美的解决了 XDDD 太感谢啦
※ 编辑: KanoLoa (203.73.234.49), 06/14/2016 14:19:05