vue框架less处理@2x,@3x背景图片选择问题

less文件中定义一个方法,然后在要使用的地方调用传入图片名称即可:

.bg-image(@url){

  background-image:~"url('@{url}@2x.png')";

  @media (-webkit-min-device-pixel-ratio:3),(min-device-pixel-ratio:3){

    background-image:~"url('@{url}@3x.png')";

}

}

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • AMD 和 CMD 的区别有哪些?AMD 是 RequireJS 在推广过程中对模块定义的规范化产出。CMD 是 ...
    竿牍阅读 726评论 0 1
  • 1、垂直对齐 如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,...
    kiddings阅读 3,215评论 0 11
  • 移动端1像素的问题 问题:一般在移动端,由于dpr(设备像素比)不为1,在PC端显示1像素的边框,在移动端其实显示...
    程序员之路阅读 589评论 0 1
  • 昔日“孟母三迁”是为教子。斯年坦人三迁则是迫于生计。 坦人辗转到一处工地打工,工地上设有住宿之处,工头便从另外的工...
    坦人阅读 332评论 1 8
  • 01 我叫松子,在一条叫荒川的河边租了间公寓。为什么要租这个公寓呢?因为,这条叫荒川的河像极了故乡那条名叫筑后川的...
    英语学了没阅读 666评论 3 3