2013-02-15 133 views
0

我在我的Mac书上创建一个网站13英寸背景图片我想用我的屏幕太大是他们的方式来保持宽高比相同时,我的屏幕上的发展所以它会看起来是一样的放大或缩小创建一个网站,可以缩小和放大,无论屏幕大小

我已经使用这个代码来缩放背景图像填满整个屏幕

background: url(images/background.jpg) no-repeat center center fixed; 
    background-size: cover; 
    background-size: cover; 
    background-size: cover; 
    background-size: cover; 

我已经使用了换页包装内容

#wrapper {margin: 0 auto 0 auto; width:1070px;height:auto; 

但它只是出现在重叠的图像,而不是发生的比例关闭,因为包装是与它留下的空间相同的宽度,但它重叠的背景图像是1772x1240绿色框的宽度是1070是他们的设计,并保持这些比率

+0

您可以张贴在的jsfiddle你的问题的代码示例也许? http://jsfiddle.net – 2013-02-15 17:08:54

回答

0

我不是针对需求,但如果你真正需要的东西是可重复使用的布局,然后按照这个。它可以在所有现代浏览器

HTML

<div class="table"> 
    <div class='row'> 
     <div class='cell'>1</div> 
     <div class='cell'>2</div> 
     <div class='cell'>3</div> 
     <div class='cell'>4</div> 
    </div> 
    </div> 

CSS:

.table{ 
    height: 50px; 
    width:100%; 
    background-color:Red; 
    display:table; 
    table-layout:fixed; 
    } 
    .row{ 
    display:table-row 
    } 
    .cell{ 
    display:table-cell; 
    line-height:50px; 
    text-align:center; 
    } 

而一个Demo,尝试调整页面

+0

这已经在某种程度上在表中工作,但我希望免费图像在这种性质的行为我还没有足够的尊重点发布图像仍然 – Miller90 2013-02-18 14:41:22

1

使用的一种方式,

background:url(images/background.jpg) 0 0 no-repeat; 
background-position:fixed;background-size:100%;