如何讓我的圖像覆蓋背景html？

我想讓我的圖像成爲封面背景，但它對我不起作用。這裏是我的代碼：如何讓我的圖像覆蓋背景html？

<b> 
<div id="feedicon" style="display:none; z-index:0;position:fixed;width:32px;height:32px;top:250px;left:0px;"> 
    <a href="http://www.willmaster.com/index.xml" target="_blank"> 
     <img src="http://www.willmaster.com/images/feed-icon32x32.png" border="0" width="32" height="32" alt="RSS" title="RSS"> 
    </a> 
</div> 
</b>

來源

2015-08-14 Nathan Gable

第一步是將圖像作爲背景設置爲['background：url（'...'）']（https://developer.mozilla.org/en-US/docs/Web/ CSS/background），不使用'img'元素。此外，從名稱猜測，32x32圖標在今天的任何屏幕上都會看起來很糟糕。除非你想要一個重複的圖像，你要以哪種方式尋找與封面圖像不同的解決方案。 –

試試這個：

h1 
 
{ 
 
    color:White; 
 
    } 
 
.fullBack 
 
{ 
 
    background-image:url('http://www.willmaster.com/images/feed-icon32x32.png'); 
 
    background-size:cover; 
 
    width:100%; 
 
    height:100%; 
 
    }

<div class="fullBack"> 
 
<h1> some content here </h1> 
 
</div>

使用background-size，你可以在頁面改變圖像大小，以覆蓋整個頁面。 This是一個很好的教程，可以幫助您瞭解如何使用該屬性，如果您希望獲得封面背景圖片。

編輯 - 重要的是要記住，background-size是一個css3特性 - 所以謹慎使用它，因爲它可能不適用於舊瀏覽器。

來源

2015-08-14 21:51:46

可能要提及'background-size：cover;'是[IE9 +特性]（https://developer.mozilla.org/en-US/docs/Web/CSS/background-size#Browser_compatibility）。 –

@MarkoGrešak編輯，謝謝:) –

如何讓我的圖像覆蓋背景html？

回答

相關問題