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. 33、mybatis（二）

    第十六章回顾SQL99中的连接查询 1)内连接 2)外连接 3)自连接 第十七章回顾hibernate多表开发 1)一对一 2)一对多 3)多对多 第十八章 mybatis一对一映射[学生与身份证] ...

  2. checkbox样式自定义

    1.使用两张图片(选中和未选中),创建一个选择器. 2.使用checkbox的   drawableLeft  drawableRight  等几个属性把选择器设置进去 3.checkbox的butt ...

  3. React,js实现分页的案列

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  4. IOS UIView 属性clipsToBounds

    当一个view上加了一个SubView 并且subview 的size超出了view的size那么默认超出部分也会显示出来,要想不显示出来设置 view的clipsToBounds属性设置成YES:即 ...

  5. python学习之安装模块

    安装pip下载python模块 yum -y install python-pip pip install pandas (pandas要安装的模块名) 默认使用的官方python源,这个在国内访问很 ...

  6. python(八)内置模块logging/os/time/sys/json/pickle

    模块 在计算机程序的开发过程中,随着程序代码越写越多,在一个文件里代码就会越来越长,越来越不容易维护.为了编写可维护的代码,我们把很多函数分组,分别放到不同的文件里,这样,每个文件包含的代码就相对较少 ...

  7. sql基本操作

    SQL功能 数据查询 SELECT 数据定义 CREATE,  DROP,   ALTER 数据操纵 INSERT,   UPDATE,   DELETE 数据控制 GRANT,  REVOKE 创建 ...

  8. CSS3的chapter6

    CSS布局          div标签: 在css布局方式中,div 是这种布局方式的核心对象,我们的页面排版不再依赖于表格, 仅从div的使用上说,做一个简单的布局只需要两样东西:div 与 cs ...

  9. GZFramwork快速开发框架之窗体设计说明

    1.  明细页数据源获取(基类已经处理) 重载GetEditData方法,此方法为自定义获得明细也的数据源,用于绑定明细页,此返回值会赋值给EditData //根据主键获得数据编辑页的数据 publ ...

  10. Java防盗链机制

    对于防盗链技术,网上提供了很多很多的相关技术,但是不是特别复杂就是效果不好. 这里在网上找到一种思路,就是关于HTTP协议响应头中包含的Referer,告诉服务器我是从哪个页面链接过来的,服务器籍此可 ...