如何定位像wanderfly.com这样的背景图片？ [英] How to position a background image like wanderfly.com?

问题描述

伙计们。我希望能够定位我的图像背景，类似于
www.wanderfly.com 。该页面的源代码显示它们使用隐藏的输入字段：

 < input value =http：// farm1。 static.flickr.com/32/35826109_27e678ec45_b.jpgid =backgroundImagetype =hidden>< / input> 
  

我尝试寻找backgroundImage的CSS实现，但找不到它。
然而他们使用的图像是1024：685，但他们想到了如何拉伸它以获得更高分辨率，从而得到整洁的全屏显示效果。

我怎么能做同样的事情？ > ID = 背景。在你的CSS写下： #background {width：100％;位置：绝对; top：0;左：0; }

演示： http://jsfiddle.net/XW9Pz/1/

Hey guys. i want to be able to position my image background similar to www.wanderfly.com . the source of that page shows that they use an hidden input field:

<input value="http://farm1.static.flickr.com/32/35826109_27e678ec45_b.jpg" id="backgroundImage" type="hidden"></input>

I tried to look for the CSS implementation of "backgroundImage" but couldn't find it. the image they use however is 1024:685 but they figured how to stretch it for higher resolution, giving that neat fullscreen display.

How would i be able to do the same?

解决方案

add an img in your html with id="background". In your css write this: #background { width: 100%; position: absolute; top: 0; left: 0; }

Demo: http://jsfiddle.net/XW9Pz/1/

这篇关于如何定位像wanderfly.com这样的背景图片？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！