デスクトップ ビュー用とは異なるモバイル専用ビュー用の画像を実装する方法については、100% 明確ではありません。
たとえば、デスクトップ用にこの画像がある場合:
&.card {
.card-image {
@include background-helper('gallery/old-pic.jpg', center, contain, no-repeat);
}
}
これは、私がこのコードを持っている mixin ファイルから来ています:
@mixin background-helper($image: false, $position: center, $size: contain, $repeat: no-repeat){
@if $image {
background-image: asset-url($image);
background-repeat: $repeat;
background-size: $size;
background-position: $position;
}
}
old-pic.jpg
ユーザーが携帯電話で表示している場合を除き、アプリケーションに何かをレンダリングするように指示する追加ロジックがわかりません。