Dreamweaver-背景圖像調整大小

我正在製作一個網站，但我有一個問題。每當我預覽它時，我的背景圖像都會比屏幕大。Dreamweaver-背景圖像調整大小

HTML：

<div class="image"> 
    <img src="images/background.jpg" alt=""> 
</div>

CSS：

.image { 
    position: absolute; 
    margin-left: -50px; 
    margin-top: -25px; 
}

我的圖像大小爲1920×1200

編輯：我做了這個代碼：

html { 
    background: url(images/background.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
}

來源

2014-02-21 1_dev_1

難道它不是浮在屏幕之外的div本身嗎？否則，只需在'.image'上使用'background-size：100％;'。 –

你的意思是背景比div.image容器大嗎？你能舉一個例子嗎？因爲你可能需要定義的是背景大小：100％自動; – jerrylow

你想要什麼解決方案？ – ntgCleaner

我WOU ld建議通過CSS放置背景圖像，然後使用background-size: cover;，因爲這可以通過瀏覽器窗口進行縮放。

來源

2014-02-21 22:00:49

試試這個：

CSS

.image { 
    background-image:url(images/background.jpg); 
    background-size:100%; 
    position: absolute; 
    margin-left: -50px; 
    margin-top: -25px; 
    width:Xpx; /* change X to what you want */ 
    height:Ypx; /* change Y to what you want */ 
}

HTML

<div class="image"> 
</div>

這不過重要的是你用這種方法添加height和width屬性圖像配 ，所以div的尺寸不會有0x0。

來源

2014-02-21 22:01:19

我不知道你在這裏試圖做什麼，但你添加樣式到div而不是圖像。

.image img{ position: absolute; margin-left: -50px; margin-top: -25px; }

將是影響div內圖像的標記。

反正用身體背景圖像代替。還有一些js文件可以將圖像適合任何尺寸的顯示。

祝你好運與您的網站！

來源

2014-02-21 22:06:22

.image { 
    position: absolute; 
    margin-left: -50px; 
    margin-top: -25px; 
    width: your value; 
    height: your value; 
    background-size: 100%; 
}

這可以得知，當你想建立一個網站你必須學會這幾樣基本知識。

來源

2014-02-21 22:07:56

Dreamweaver-背景圖像調整大小

回答

相關問題