transform:rotate 属于简单好用的效果,但在手机上显示时,会有比较明显锯齿。

解决方案也很简单, 利用外层容器的overflow:hidden 加上图片margin:-1px 就可以解决。

原理没去深究,理论上是矢量跟位图的处理不一样,这个方案也有个小问题 就是图片变小了 ^_^ 可以用手机看看demo http://labs.aoao.org.cn/demo/transform-rotate/

update: 大家反应这方案在电脑上反而会出问题。

我测试了个新的方案rotate3d + border:1px solid transparent;,问题也算是解决了。

同时发现另一个小问题,缩放的图片使用rotate3d 在非retina 屏下图片会变模糊了点点(属于不对比不发现的),而用rotate就没这问题,这个问题在old iPad 发现。

同时又发现另另一个小问题,iOS 4.x上的 想要平滑,缩放图片哪种都会变模糊了点点(同样属于不对比不发现的),这个问题在old old iPhone 发现的。

当然,本来缩放图片是件不好的事,可是缩放图片在这里是故意的,大家选适合的方案在对应的场景使用吧,原本方案就没想着要在电脑上的浏览器上使用的

transform:rotate在手机上显示有锯齿的解决方案的更多相关文章

  1. transform:rotate在手机上显示有锯齿的解决方案大全

    先来个兼容性说明,洗洗脑: div{transform:rotate(7deg);-ms-transform:rotate(7deg); /* IE 9 */-moz-transform:rotate ...

  2. 如何正确地在手机上显示图片——QImage与QPixmap完全解析

    引言 用Qt程序在手机上显示一幅图片对编程人员来说是再基础不过的一件事情了.那么先让大家看两段代码: //dangerous should not be used, cannot display ea ...

  3. Ionic生成的App安装在手机上后无法联网的解决方案

    在Ionic中使用inappbrowser.themeablebrowser 组件打开网页,刚开始是好的,后来不知添加什么插件,导致了安装在手机上以后没有网络访问权限. 尝试了很多,最后才发现,此时, ...

  4. Android 代码中文字在手机上显示乱码问题解决方法

    在学习Android过程中,用于测试时发现,代码中的中文在真机上会显示乱码, 网上查阅了些资料,参考如下: http://www.androidchina.net/3024.html http://b ...

  5. .Net语言 APP开发平台——Smobiler学习日志:如何在手机上显示类似EXCEL表格

    最前面的话:Smobiler是一个在VS环境中使用.Net语言来开发APP的开发平台,也许比Xamarin更方便 样式一 一.目标样式 我们要实现上图中的效果,需要如下的操作: 1.从工具栏上的&qu ...

  6. Web页面在手机上显示过大问题

    网上抄来了,自己也备忘下:增加<meta name="viewport" content="width=device-width, initial-scale=1. ...

  7. 第十二篇 -- 关于U盘制作启动盘后在本机上显示不出来的解决方案

    喜欢玩电脑的朋友应该都重装过系统,最常用的就是用U盘装系统.以前装系统都没问题,不过偶然一次发现了一个问题,就是那个被制作成启动盘的U盘,插在本机上只能显示EFI启动文件部分,而其他空间全都显示不出来 ...

  8. InteractiveHtmlBom 在手机上无法显示 BOM List 和装配图的问题

    InteractiveHtmlBom 在手机上无法显示 BOM List 和装配图的问题 InteractiveHtmlBom 插件是一款用于 KiCad BOM 装配图生成插件. 最近新生成的 文件 ...

  9. 如何在手机上实现 H5 页面全屏显示

    如何在手机上实现 H5 页面全屏显示 fullscreen 隐藏头部地址栏 隐藏底部导航栏 refs xgqfrms 2012-2020 www.cnblogs.com 发布文章使用:只允许注册用户才 ...

随机推荐

  1. 前端开发面试题JS

    1.介绍js的基本数据类型. Undefined.Null.Boolean.Number.String. ECMAScript 2015 新增:Symbol(创建后独一无二且不可变的数据类型 ) 2. ...

  2. javaWeb 使用 filter 处理全站乱码问题

    1. web.xml文件中的配置 <filter> <filter-name>CharacterEncodingFilter</filter-name> <f ...

  3. 浅析firmware完整生存和使用流程 【转】

    转自:http://blog.csdn.net/zhenwenxian/article/details/4677604 浅析firmware完整生存和使用流程 1. http://blog.china ...

  4. 导出db2数据库的表结构和数据(转载)

      对于db2数据库,导入和导出表结构和数据其实很简单,只需要用到db2look和db2move两个命令即可.这两个命令都需要在客户端的命令行处理器 中执行,但对于数据库服务器和客户端不在同一机器上的 ...

  5. 【转】 MySQL与PostgreSQL:该选择哪个开源数据库?哪一个更好?

    转载地址:http://www.infoq.com/cn/news/2013/12/mysql-vs-postgresql 如果打算为项目选择一款免费.开源的数据库,那么你可能会在MySQL与Post ...

  6. Script循环语句 的相关知识跟练习

    循环语句有两种问题类型:穷举和迭代 穷举: 在不知道什么情况下才是我们需要的结果的时候,只能让它一个一个的都执行一遍 迭代:在现有的条件下,根据规律,不断求解中间情况,最终推选出结果 两个关键词 br ...

  7. laravel框架总结(六) -- 门面(facades)

    Facades 为应用程序的服务容器中可用的类提供了一个「静态」接口.   Laravel 本身附带许多的 facades,甚至你可能在不知情的状况下已经在使用他们!   xpower的静态接口(门面 ...

  8. EFS加密解密----重装系统后

    重装系统尤其是格式化重装系统之后,如果没有正确地备份私钥,那么加密的文件将无法打开,加密的文件也暂时没有办法进行快速破解. 并非重装后用相同用户名+密码就可以解密的. Advanced EFS Dat ...

  9. Linux下环境变量设置

    分类 Linux下的环境变量按生存周期来划分,可以划分为两种: 1)永久的:需要修改配置文件, 变量永久生效 2)临时的:直接在终端使用export命令声明即可,但是关闭shell后失效. 设置方法 ...

  10. centos BIND服务基础及域主服务器配置

    系统信息: Linux localhost.localdomain -.el6.i686 # SMP Tue Dec :: GMT i686 i686 i386 GNU/Linux 因为看的是linu ...