背景圖像拉伸

我想伸展背景圖像匹配屏幕背景圖像拉伸

body { 
    margin-left: auto !important; 
    margin-right: auto !important; 
    width: 80%; 
    background-image: url(hola.jpg); 
}

我試圖把background-size: 1500px 1500px;和固定的大小。

我如何做到這一點，並自動爲所有頁面的決議？

來源

2013-11-03 Ninjacu

看看css-tricks：[Perfect Full Page Background Image]（http://css-tricks.com/perfect-full-page-background-image/）。順便說一下，你只能使容器AFAIK的背景大，所以'width：80％'會成爲問題。 –

使用此，如果您<body>沒有覆蓋整個窗口應該甚至工作：

background-attachment: fixed; 
background-size: 100%;

（來源：https://developer.mozilla.org/en-US/docs/Web/CSS/background-size：

<percentage>
可以擴展的背景A值背景定位區域的指定百分比的相應尺寸，由background-origin的值決定[...]如果背景的附件是固定的，背景定位電離區域是瀏覽器窗口的整個區域，不包括滾動條所覆蓋的區域（如果存在的話）。 [...]

來源

2013-11-03 15:15:05

background-size:cover; 
background-position:50% 50%;

Not compatible with IE8 and lower，你來決定你是否需要現在IE11已經脫離支持這些。

來源

2013-11-03 15:15:28

背景圖像拉伸

回答

相關問題