如何让我的图像覆盖背景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？

回答

相关问题