所以我想在我的页脚上方从左到右填充草。我很难让它重复一遍。我将位置设置为固定,然后也将其设置为浮动:左但仍然没有运气。我只会不断地在HTML中添加更多的硬编码图像,但是我觉得我可以使用CSS做到这一点,而没有100行额外的代码。另外,如果用户使浏览器更大或更小,我希望图像增大或缩小。
的HTML
<figure>
<img src="arrow.png" alt="arrow" class="arrow">
<p class="clickHere"> Click one! </p>
<img src="downwardmonkey.png" alt="down" class="head">
<img alt="down" class="footer">
</figure>
的CSS
figure img.footer
{
position: fixed;
bottom: 45px;
float: left;
background-image: "grass.png";
background-repeat: repeat-x;
}
如果需要任何其他代码来帮助让我知道!
而不是放置图像标签,而是放置一个div并为其提供背景图像
<figure>
<div class="grassImageDiv"></div>
</figure>
CSS:
.grassImageDiv
{
display: inline-block;
background-image: url("grass.png");
width:100%; //To make it browser size independent
height: 80px;
}
您可以根据需要指定高度和宽度。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句