屏幕尺寸CSS3上的图像更改

时间:2016-01-26 12:13:44

标签: image css3 mobile

header.css包含以下内容

#logo { background: url(../Images/tarot/800.jpg); width:100%; 
}

@media only screen and (max-device-width: 480px) {
#logo { background: url(../Images/tarot/400.jpg); width: 100%; }
}


@media only screen and (min-device-width: 1200px){
#logo { background: url(../Images/tarot/1000.jpg); width: 100%; }
}

目前的HTML页面包含

<div class="container-fluid"> 
   <div class="logo"></div>
</div>

0 个答案:

没有答案