2、3倍图处理

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")

本人用stylus，基本原理就是根据 @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3)判断，然后用UI给的不同图片。

作者：BULL_DEBUG
链接：https://www.jianshu.com/p/eba6bedd25b0
來源：简书
简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。

2x or 3X的图的更多相关文章

  1. 手机加载优化 - 2x、3x图

    人们常说,现在的流量不值钱了,图越大越好咯! 我想说的是,浏览器虽然不值钱了,但速度还是略快吧! 文章来自:UI妹儿 icon_alipay.png→iPhone 1-3代的手机(已经不考虑了) ic ...

  2. SVN如何处理包含@2x or @3x的图片文件

    一般iOS图片文件都会包含@2x,@3x之类的字符比如icon@2x,icon@3x,当你在svn命令行中add或是delete的时候总是报错说file does not exit之类的错误,其实之类 ...

  3. ios 判断屏幕显示是@2x还是@3x来调用字体大小

    传统font大小适配可能会根据屏幕宽度与iphone5或iphone6宽度的一个比例来适配.但如果有这样一个需求,在显示@2x图片的手机上显示一种字体,在显示@3x图片的手机上显示另一个固定大小的字体 ...

  4. Python——2x和3x的区别汇总

    1. 初始解释器编码: 2x:ascii 编码(不自持中文) 3x:unicode编码 推荐全部更换为utf-8 2. 输出方式不同 2x:print ‘你好’2.7版本的两种都支持 3x:print ...

  5. iOS中的2x，3x问题

    iPhone的屏幕显示效果非常出色.刚进入市场时,iPhone是当时分辨率最高的手持电子设备.不过,iPhone 的显示空间并不大,比现代计算机的屏幕空间要小很多.最初几代iPhone的屏幕分辨率只有 ...

  6. iOS开发 2x 3x图

    众所周知,iOS开发中的图片资源一般需要2倍图和3倍图,也就是2x,3x,但是最近思考了一个问题,为什么不能只提供3x的图片,2x的图片让系统从3x压缩就好了,于是上网搜索了下,得到了答案. 当我们在 ...

  7. iOS开发--appstore应用上架

    除了企业级的应用,一般一个应用开发完成后,都会上架App Store.其实上架流程并不繁琐,麻烦的是要耗时等待审核,如果被拒,修改后又需要等待.被拒的原因很多(真的很多…),比如程序有崩溃,适配没做好 ...

  8. 减肥App计划

    写在前面   最近公司需求不多,正好研究一下 App 瘦身的办法,写了点小总结. 如果你不知道下面几个问题,不妨可以看看文章. 使用 .xcassets 有什么好处? @1x .@2x 和 @3x 会 ...

  9. iOS 2x 3x

    iOS中: 备注: Retina是一种显示技术,可以将把更多的像素点压缩至一块屏幕里,从而达到更高的分辨率并提高屏幕显示的细腻程度.而其最初该技术是用于苹果的iPhone4上.其屏幕分辨率为960×6 ...

随机推荐

  1. Connector for Python

    连接mysql, 需要mysql connector, conntector是一种驱动程序,python连接mysql的驱动程序,mysql官方给出的名称为connector/python, 可参考m ...

  2. IP通信基础学习第三周（下）

    TTL的最值是255. 数据部分不参与检验和的计算. 接收端的结果若为0,则保留:否则,会丢弃该数据报. IP数据报选项字段是可选的,主要用于网络测试和调试. IP辅助协议ICMP的消息类型有错误消息 ...

  3. drf 多表

    https://www.django-rest-framework.org/  官方站 https://www.django-rest-framework.org/tutorial/quickstar ...

  4. Spring中三种编程式事务的使用

    引入事务管理器 @Autowired TransactionTemplate transactionTemplate; @Autowired PlatformTransactionManager tr ...

  5. SQL语句——exists和in区别

    表结构及数据 user表 order表 in select * from table A where id in (xxxxxxxxxxx):满足条件的数据会被查出来: 先查询子查询的表,然后将内表. ...

  6. Linux 最小系统制作

    Linux 最小系统制作 一.制作工具Busybox 在制作文件系统的时候,我们需要使用“Busybox 工具”,即为附件压缩包“busybox-1.21.1.tar.bz2”.“BusyBox 工具 ...

  7. unity 根据平板 或者 手机 确立横竖屏

    /* ######### ############ ############# ## ########### ### ###### ##### ### ####### #### ### ####### ...

  8. Cent OS6下SS+BBR+改SSH端口

    SS+BBR+改SSH端口 (一)搭建SS wget --no-check-certificate -O shadowsocks-libev.sh https://raw.githubusercont ...

  9. loadrunner常用函数集锦

    一.三个复制函数的区别: strcpy 原型:extern char *strcpy(char *dest,char *src);用法:#i nclude功能:把src所指由NULL结束的字符串复制到 ...

  10. VUE之图表操作

    参考 v-charts文档有详细说明,不多做介绍. 感谢博主的梳理,我在此基础之上稍作修改 效果展示: 在工作中遇到了就记录下来,留作备用,以便今后查阅: 安装 npm install vue-sch ...