html旋转三角菜单,css3 这个三角怎么旋转_html/css

无标题文档

回复讨论(解决方案)

box_rotate {

-moz-transform: rotate(7.5deg); /* FF3.5+ */

-o-transform: rotate(7.5deg); /* Opera 10.5 */

-webkit-transform: rotate(7.5deg); /* Saf3.1+, Chrome */

filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.9914,M12=-0.1305,M21=0.1305,M22=0.9914,SizingMethod=’auto expand’);

-ms-filter: “progid:DXImageTransform.Microsoft.Matrix(M11=0.9914,M12=-0.1305,M21=0.1305,M22=0.9914,SizingMethod=’auto expand’)”; /* IE8 */

}

除了IE以外，其他浏览器都是用rotate函数，实现某个对象的旋转。比如rotate(7.5deg)就表示顺时针旋转7.5度(degree)。

IE则需要用到一个复杂的滤镜DXImageTransform.Microsoft.Matrix。它一共接受五个参数，前四个参数需要自行计算三角函数，然后分别写成M11 = cos(rotation),M12 = -sin(rotation),M21 = sin(rotation),M22 = cos(rotation)，其中的rotation表示旋转角度，如果顺时针旋转7.5度，则rotation就为7.5；第五个参数SizingMethod表示重绘方式，’auto expand’代表自动扩展到新的边界。

除了这个滤镜，IE还有一个稍微简单一点的滤镜DXImageTransform.Microsoft.BasicImage(rotation=x)。其中的x只能取值为1，2，3，0，分别表示顺时针选择90度、180度、270度和360度。

声明：本文原创发布php中文网，转载请注明出处，感谢您的尊重！如有疑问，请联系admin@php.cn处理

html旋转三角菜单,css3 这个三角怎么旋转_html/css_WEB-ITnose相关推荐

[css] 使用css3做一个魔方旋转的效果
[css] 使用css3做一个魔方旋转的效果总的来说,用了一些 3D 效果的样式,如 translate3d,rotate3d,perspective,transform-style: preser ...
CSS3动画 - 地球 - 指南针旋转
CSS3动画 - 地球 - 指南针旋转工作之余,休息那一下,闲来无事,用CSS3属性animation做了两个插件: 指南针-地球体质指数速查卡 1. 效果图 2. 部分代码如下: <!DO ...
css3仿天气风车旋转
css3仿天气风车旋转风车翅膀是会转动的代码如下 <html lang="en"><head><meta charset="UTF-8& ...
2D转换之旋转rotate（CSS3）
2D转换之旋转rotate(CSS3) <!DOCTYPE html> <html lang="en"><head><meta chars ...
我的学习笔记004--javascript实现旋转导航菜单mxx
使用的方法 1,js dom css 2,Math函数示例代码 <!<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transition ...
css3 动画之 2D旋转 3D旋转放大
<!DOCTYPE html> <html> <head><meta http-equiv="Content-Type" content= ...
20211115 任意n阶方阵均与三角矩阵（上三角或者下三角）相似
设 A\boldsymbol{A}A 为 nnn 阶矩阵, 它的特征多项式为 φ(λ)=det⁡(λI−A)=(λ−λ1)(λ−λ2)⋯(λ−λn)\varphi(\lambda)=\operator ...
旋转立体相册制作html,用CSS3制作3D动态旋转相册
最近做一个网站,想弄一个炫酷的效果,所以想到了用CSS3做一个图片3D旋转的效果.[实际就是做一个3D动态旋转相册,自己发挥哦] 下面直接上代码了. -------------------start- ...
css3动画图片旋转绕轴,css3图片旋转如何实现？css3实现图片旋转动画效果的方法...
在网页中,我们经常可以看到一张图片在旋转,这样的图片旋转是怎么来实现的呢?本篇文章就来为你介绍一下关于css3实现图片旋转动画效果的方法. 实现css3中图片的旋转可以使用可以使用 -webkit-a ...

html旋转三角菜单,css3 这个三角怎么旋转_html/css_WEB-ITnose

html旋转三角菜单,css3 这个三角怎么旋转_html/css_WEB-ITnose相关推荐

最新文章

热门文章