maedaaki
10/3/2019 - 6:40 AM

Cssの背景画像でretina display対応させる場合

.front-doctorGreetings{
height: 712px;
width: 100%;
background-size: 70%;
background-position: left;
background-repeat: no-repeat;
margin-bottom: 173px;
}
.front-doctorGreetings.lazyloaded{
background-image: url(assets/images/front-doctor.jpg);
@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and ( min--moz-device-pixel-ratio: 2),
only screen and ( -o-min-device-pixel-ratio: 2/1),
only screen and ( min-device-pixel-ratio: 2),
only screen and ( min-resolution: 192dpi),
only screen and ( min-resolution: 2dppx) {
background-image: url(assets/images/front-doctor@2x.jpg);
}
}