高级 CSS 布局 |带超大图片的固定柱
好吧，今晚我的大脑可能不工作了。我想要完成的是两列布局，其中一列滚动，另一列固定。固定列中有一个非常大的背景图像，我希望能够缩放到屏幕的大小。此外，左（固定）列的宽度必须缩放以适应背景图像。真正解释这一点的最好方法是用一张图片： 
带有箭头的突出显示区域将滚动，其中包含图片和 Twitter 状态的另一列将保持固定。我的问题与固定的 CSS 定位无关。我的问题是根据屏幕尺寸缩放列，以便图片始终保持此处显示的比例，无论是其自身尺寸还是其他列的尺寸。这就是我所坚持的。有什么想法吗？我真的很感谢你的帮助。
OK so my brain is just probably not working tonight. What I'm trying to accomplish is a two column layout where one column scrolls and the other is fixed. The fixed column has a very large background image in it that I would like to be able to scale to the size of the screen. Additionally the left (fixed) column's width would have to scale to accommodate the background image. The best way to really explain this is with a picture:
The highlighted area with the arrow in it will scroll and the other column with the picture and twitter status in it would remain fixed. My problem does not come into play with the fixed CSS positioning. My issue is with scaling my columns based on screen size so that the picture always remains in the proportion it's shown here both in it's own dimensions and those of the other column. That's what I'm stuck on. Any ideas? I really appreciate the help.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
我认为您可以在第一列中使用图像元素并将其设置为 100% 的父元素。如果父 div 也是百分比，那么它的大小当然会改变，并且也会缩放其中的图像。如果我们希望图像缩放，那么我们就不能同时指定高度。
I think you can just use an image element in your first column and set it to take 100% of its parent. If the parent div is also a percentage then its size will change of course and that also scales the image within. If we want the image to scale, then we can't also specify a height.
在此处检查您的 JS FIDDLE 代码： http://jsfiddle.net/4P9fJ/7/
因为您 din更不用说您会更改背景中的图像，我在正文标记中提供了背景图像。
Check your JS FIDDLE CODE HERE : http://jsfiddle.net/4P9fJ/7/
Since you din't mention you'd be changing the images in your background i provided the background image in the body tag .