如何使用图片标签和src设置设置背景图像

时间:2016-02-29 04:21:39

标签: html css image

如何将图像设置为div的背景。因此div应该占用图像的高度。此功能需要使用HTML中的图片标记和srcset属性来实现。如果图像上有一些文本覆盖,则图像应保留在相同的高度,但div高度应随文本增长。 下面是我试过的代码,但我的div高度没有增加

<style>
.image { 
   position: relative; 
   width: 100%; /* for IE 6 */
}

.info{ 
   position: absolute; 
   top: 200px; 
   left: 0; 
   width: 100%; 
   color: yellow;
}



</style>
<script src="picturefill.min.js"></script>


<div class="image">
    <picture>
        <source srcset="new-york-city-wallpapers-desk.jpeg" media="(min-width: 1240px)">
        <source srcset="new-york-city-wallpapers-tab.jpeg" media="(min-width: 940px)">
        <source srcset="new-york-city-wallpapers-mob.jpeg" media="(min-width: 724px)">

        <img srcset="" src="new-york-city-wallpapers-mob.jpeg" alt="" />
    </picture>
      <div class="info">
      <h1>The new Galaxy S7 edge | Galaxy S7</h1></br>
      <h2>Go dipper into Samgung's brightest new stars-available now-and</h2></br>
      <h2>learn all about our limited-time special offers.</h2> 
      </div>`enter code here`

</div>

0 个答案:

没有答案