开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

ie9变换:rotate()在ie9中不起作用

在IE9中，transform属性的rotate()函数不起作用。这是因为IE9不支持CSS3的transform属性。transform属性用于对元素进行旋转、缩放、倾斜或平移等变换操作。rotate()函数是其中的一种变换操作，用于对元素进行旋转。

然而，虽然IE9不支持transform属性的rotate()函数，但可以通过其他方式实现元素的旋转效果。一种常见的方法是使用IE9支持的滤镜效果（filter）。通过设置filter属性的值为"progid:DXImageTransform.Microsoft.Matrix"，可以在IE9中实现元素的旋转效果。

以下是一个示例代码，演示如何在IE9中实现元素的旋转效果：

<!DOCTYPE html>
<html>
<head>
<style>
    .rotate {
        width: 100px;
        height: 100px;
        background-color: red;
        filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.9848077530122081, M12=-0.17364817766693033, M21=0.17364817766693033, M22=0.9848077530122081, SizingMethod='auto expand');
    }
</style>
</head>
<body>
    <div class="rotate"></div>
</body>
</html>

在上述代码中，我们创建了一个宽高为100px的红色方块，并通过设置filter属性的值来实现旋转效果。其中，M11、M12、M21、M22分别表示旋转矩阵的四个参数，可以根据需要调整这些参数来实现不同的旋转角度。

需要注意的是，虽然通过滤镜效果可以在IE9中实现元素的旋转效果，但滤镜效果的性能较低，且语法较为复杂。因此，在现代的Web开发中，推荐使用更先进的浏览器，如Chrome、Firefox等，以获得更好的用户体验和开发效率。

腾讯云相关产品和产品介绍链接地址：

腾讯云官网：https://cloud.tencent.com/
云服务器（CVM）：https://cloud.tencent.com/product/cvm
云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
云存储（COS）：https://cloud.tencent.com/product/cos
腾讯云区块链服务（TBC）：https://cloud.tencent.com/product/tbc
腾讯云物联网平台（TIoT）：https://cloud.tencent.com/product/tiot
腾讯云移动开发平台（MTP）：https://cloud.tencent.com/product/mtp

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

css笔记 - transform学习笔记(二)

属于2D/3D上的转换、变形效果。他不是一个动画，他就是变形。比如正方形变平行四边形，再变圆形。都是形状变成另一个形状。

01

css+div知识温馨

直接对盒子设置margin-left:auto; margin-right:auto ,如果要设置垂直居中，发现这种方法无效，无法通过设置margin:auto让垂直也居中

02

兼容性测试工具分享

有多少朋友做过浏览器兼容性测试？怎么做的，效率怎么样，是在不同的机器上下载不同的浏览器进行效果确认？有多少人对浏览器的兼容性测试犯过愁？　　本人曾经也对浏览器的兼容性感到头痛，后来到网上找了些资料和工具，虽然未能彻底解决所遇到的问题，不过多少有些帮助，特此分享给大伙，若大伙有什么更好的工具或是经验方法还希望能拿出来晒一晒。　　鄙人主要尝试过这几个工具:IETester, SuperPreview,Browsershots，Browser Sandbox。下面分别说一下。 IETester 估计工作

08

Web页面中5种超酷的Hover效果

想在自己的网站中应用超酷的hover效果吗？也许你可以从如下的这些实例中获得一些灵感，如果你喜欢这些效果，也可以直接拷贝代码并应用到你的站点。给平淡的站点带来活力 hover效果能给网页增加一些动态效果，并且使得站点更具有活力。原来的做法是使用javascript来实现这些动态效果，但是随着CSS3的引入和现代浏览器的支持，我们可以用纯粹的CSS代码来实现这些有趣的效果。所谓的现代浏览器，更多的是指以Mozilla和Webkit为核心的浏览器，IE的表现稍微差强人意，所以请使用FireFox，Safari

Bootstrap 4/3 页面基础模板与兼容旧版本浏览器

Bootstrap 3 与 4 差别很大，目录文件结构、所引入的内容也不同，这里说说一下 Bootstrap 引入的文件、网页模板和兼容性问题。本网站刚刚搭建好，正好发一下文章原来测试网站。

03

canvas 实现自定义钟表

参考博客：https://www.cnblogs.com/liugang-vip/p/3557983.html

01

名人堂 | CSS3 transform对普通元素的N多渲染影响

关于作者张鑫旭，09年华中科技大学毕业，现上海，就职于阅文集团，专注web前端偏前领域，钓鱼爱好者。本文转载自张鑫旭-鑫空间-鑫生活。 0写在前面一个普普通通的元素，如果应用了CSS3 transform变换，即便这个transform属性值不会改变其任何表面的变化（如scale(1), translate(0,0)），但是，实际上，对这些元素还是造成了写深远的影响。所谓表面无恙，内心奔溃的真实写照。以下就是自己列举的几个比较有代表性的表现示例，欢迎补充！ 1transform提升元素的垂直

01

css3 动画应用 animations 和transtions transform在加上JavaScript 可以实现硬件加速动画。

transitions(过渡) 被应用于元素指定的属性变化时，该属性经过一段时间逐渐的过渡到最终想要的值。　　主要包括四个属性：　　　　执行变换的属性：transition-property 变换延续的时间：transition-duration 　　　　变换的速率变化：transition-timing-function 　　　　变换延迟时间:transition-delay。　　　　1.transition-propery 　　　　　　语法：transition-property:

transform 的副作用

本文主要探讨了 transform 属性对元素布局和渲染的影响，包括改变元素的定位、层叠顺序等。通过具体例子，分析了 transform 属性在改变元素布局中的种种作用，并提出了在何种情况下使用 transform 属性更优的建议。

09

transform 的副作用

transform 想必大家都很熟悉，可以通过其转换（translate）、旋转（rotate）、缩放（scale）、倾斜（skew）等属性来对元素进行变换，不过这篇文章想探讨的不是这些内容，而是 transform 对元素布局、页面渲染方面的影响。例如，你知道它会影响 fixed 元素的位置吗？你有想过它会改变元素的层叠顺序吗？

01

CSS3 做一个旋转的立体3D正方形动效核心【前端就业课第二阶段】CSS 零基础到实战（07）

若是大一学子或者是真心想学习刚入门的小伙伴可以私聊我，若你是真心学习可以送你书籍，指导你学习，给予你目标方向的学习路线，无套路，博客为证。

02

scss\sass calc 的mixin&include 处理方法

目前主流的浏览器对于calc属性已经支持得非常好了.所以,我准备在我们的新项目中全面启用这个属性,省得在布局方面还得用js去实现.经过详细的布局测试,总算做出来了一个demo页面.在各个pc浏览器上没有任何问题,甚至IE9都没有问题.

01

谈谈StatusBar相关的东西

2、有导航栏的情况如果我们使用了导航控制器 UINavigationController，且它的 navigationBar 没有被隐藏，那么会发现即使重写 preferredStatusBarStyle 方法，这个方法也不会被调用。因为此时状态栏的样式是根据导航栏的样式来自动变换的。

02

移动端样式问题汇总

-webkit-tap-highlight-color：rgba（0，0，0，0）;

02

【基础系列】CSS专题

filter: url(blur.svg#blur); /* FireFox, Chrome, Opera */

02

canvas学习笔记（七）—-裁切路径

clip（）将当前的路径转换为裁剪路径只能用一次，后续再用，不起作用 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>day5-1</title>

02

【css基础】如何理解transform的matrix()用法

实现炫酷的网页动画效果，自然少不了css3中transform的属性，此属性功能丰富且强大，比如实现元素的位移translate(x,y)，缩放scale(x,y)，2d旋转rotate(angle)，倾斜变换skew(x-angle,y-angle)等，利用这些属性可以实现基本的动画效果，如果你要实现自定义和像素级别控制的高级动画效果，我们还需要深入了解它的另外一个属性——matrix，matrix就是矩阵的意思，听起来是不是很高级，你没听错实现更高级的效果，你需要了解“矩阵”，听到“矩阵”，是不是很惊慌，当初笔者学习线性代数时也甚是无聊，真不知道这门课有啥用，没想到这门课在计算机领域应用十分广泛，比如本文说的动画效果，还有现在火爆的人工智能，真是悔不当初，当时没有好好学习这么课程。

03

「HTML+CSS」--自定义加载动画【041】

文章仅作为学习笔记，记录从0到1的一个过程。希望对您有所帮助，如有错误欢迎小伙伴指正～

04

【css基础】如何理解transform的matrix()用法

实现炫酷的网页动画效果，自然少不了css3中transform的属性，此属性功能丰富且强大，比如实现元素的位移translate(x,y)，缩放scale(x,y)，2d旋转rotate(angle)，倾斜变换skew(x-angle,y-angle)等，利用这些属性可以实现基本的动画效果，如果你要实现自定义和像素级别控制的高级动画效果，我们还需要深入了解它的另外一个属性——matrix，matrix就是矩阵的意思，听起来是不是很高级，你没听错实现更高级的效果，你需要了解“矩阵”，听到“矩阵”，是不是很惊慌，当初笔者学习线性代数时也甚是无聊，真不知道这么课有啥用，没想到这门课的在计算机应用领域应用十分广泛，比如今天说的动画效果，还有现在火爆的人工智能，真是悔不当初，当时没有好好学习这么课程。

04

List.append() 在 Python 中不起作用，该怎么解决？

Python 是一种强大而灵活的编程语言，它提供了许多方便的数据结构和操作方法，其中之一就是列表（List）。列表是一个有序的集合，可以包含不同类型的元素，并且可以进行添加、删除和修改等操作。在 Python 中，我们通常使用 List.append() 方法向列表末尾添加元素。然而，在某些情况下，你可能会遇到 List.append() 方法不起作用的问题。本文将详细讨论这个问题并提供解决方法。

02

DIV元素水平和垂直居中

在前端开发过程中，经常要对元素进行居中设置。一般有水平居中，和垂直居中。一般设置水平居中简单。基本是margin:0 auto，就可以了。但是垂直居中，我们有时会觉得使用vertical-align,但是这个属性对div元素不起作用。目前通用的解决办法是，使用绝对定位，然后设置left和top为50%。然后通过margin来设置。下面具体代码演示了一个简单的登录页面，然后使登录界面水平居中和垂直居中。代码如下： <html> <head> <title>div元素水平和垂直居中</

08

MYSQL用法(八) 索引失效的各种情况小结

如：select * from test where id-1=9;//错误的写法

02

Java工程中添加依赖jar包不起作用问题总结

Java工程中添加依赖jar包不起作用问题总结此次总结两种方式的依赖问题 1 在Eclipse中添加依赖jar包不起作用问题这种方式可能是Eclipse缓存，或者Eclipse还没有反应过来。例如Eclipse中有个Java工程以前依赖了a.jar文件，但是在工程中删除这个文件后，工程可以正常执行，这可能是Eclipse缓存问题。这种情况刷新Eclipse中的Java工程或者重启Eclipse即可。 2 Linux中添加依赖jar包不起作用问题造成这种情况的原因是有多个进程在

07

python转置矩阵函数_对python 矩阵转置transpose的实例讲解

image_vector_len = np.prod(image_size)#总元素大小，3*55*47

03

移动开发-响应式

移动开发-响应式布局响应式开发原理: 使用媒体查询针对不同宽度的设备进行布局和样式设置，从而适配不同设备设备划分尺寸区间超小屏幕 (手机) < 768px 小屏设备 (平板) >= 768px ~ < 992px 中等屏幕 (桌面显示器) >= 992px ~ <1200px 宽屏设备 (大桌面显示器) >= 1200px 响应式布局容器: 响应式需要一个父级做为布局容器，来配合子级元素来实现变化效果原理就是在不同屏幕下，通过媒体查询来改变这个布局容器的大小，再改变里面子元素的排列方式和大小，从

02

Android中的Matrix(矩阵)

看这篇笔记之前先看一下参考文章，这篇笔记没有系统的讲述矩阵和代码的东西，参考文章写的也有错误的地方，要辨证的看。

01

currentstyle 织梦_dede currentstyle属性完美解决方案

问题一、dede让channelartlist标签支持currentstyle属性完美解决

02

CSS3变形属性

CSS3变形 CSS2.1中的页面都是静态的，网页设计师也习惯把它作为页面效果的设计工具。多年来，Web设计师依赖于图片、Flash或 JavaScript才能完成修改页面的外观。 CSS3将改变设计师这种思维，借助CSS3可以轻松倾斜、缩放、移动以及翻转元素。 2012年9月，W3C组织发布了CSS3变形工作草案。允许CSS把元素转变为2D或3D空间，这个草案包括了CSS32D变形和CSS33D变形。CSS3变形是一些效果的集合，比如平移、旋转、缩放和倾斜效果，每个效果都称为变形函数（ Transform Function），它们可以操控元素发生旋转、缩放、平移等变化。这些效果在之前都需要依赖图片、Flash或JavaScript才能完成。而使用纯CSS来完成这些变形无须加载这些额外的文件，再一次提升了开发效率，提高了页面的执行效率。 CSS3变形属性及函数： CSS3变形允许动态的控制元素，可以在屏幕周围移动它们，缩小或扩大、旋转，或结合所有这些产生复杂的动画效果。通过CSS变形，可以让元素生成静态视觉效果，也可以很容易结合CSS3的transition和动画的keyframe产生一些动画效果：http:/ /www.iis7.com/b/wzjk/ CSS3变形中具有 X/ Y可用的函数： translateX()、translateY()、scaleX()、scaleY()、skewX()和skewY()。 1，CSS3 2D变形函数包括： translate()、scale()、rotate()和skew()。translate()函数接受CSS的标准度量单位； scale()函数接受一个0～1 之间的十进制值； rotate() 和 skew() 两个函数都接受一个径向的度量单位值deg。除了rotate()函数之外，每个函数都接受X轴和Y轴的参数。 2D变形中还有一个矩阵matrix()函数，包括6个参数。 2，CSS3 3D变形函数包括： rotateX()、rotateY()、rotate3d()、translateZ()、translate3d()、scaleZ()和scale3d()。 3D变形中也包括一个矩阵matrix3d()函数，包括16 个参数。 CSS 变形属性详解： transform属性指一组转换函数， transform-origin属性指定元素的中心点在哪，新增加了第三个数transform-origin-z，控制元素三维空间中心点。 transform-style的值设置为preserve- 3d，建立一个3D渲染环境。：CSS3 2D变形在二维或三维空间，元素可以被扭曲、移位或旋转。只不过2D变形工作在X轴和Y轴，也就是大家常说的水平轴和垂直轴；而3D变形工作在X轴和Y轴之外，还有一个Z轴，这些3D变换不仅可以定义元素的长度和宽度，还有深度。首先讨论元素在2D平面如何变换，然后在进入3D变换的讨论。CSS32D变换让Web设计师有了更多的自由来装饰和变形HTML组件，同时有更多的功能装饰文本和更多的动画选项来装饰div元素。2D位移在这里translate是一种方法，将元素向指定的方向移动，类似于position中的relative。可以简单理解为，使用translate()函数可以把元素从原来的位置移动，而不影响在 X、 Y 轴上任何组件。 translate() 函数可以取一个值tx，也可以取两个值tx和 ty， ·tx：代表X轴（横坐标）移动的向量长度，当其值为正值时，元素向X轴右方向移动，反之其值为负值时，元素向X轴左方向移动。 ·ty：代表Y轴（纵坐标）移动的向量长度，当其值为正值时，元素向Y轴下方向移动，反之其值为负值时，元素向Y轴上方向移动。如果ty没有显式设置时，相当于ty=0。结合起来， translate()函数移动元素主要有以下三种移动。 -水平移动：向右移动 translate( tx, 0) 和向左移动 translate(- tx, 0)。 -垂直移动：向上移动 translate( 0,- ty) 和向下移动 translate( 0, ty)。 -对角移动：右下角移动 translate( tx, ty)、右上角移动translate( tx,- ty)、左上角移动translate(- tx,- ty) 和左下角移动translate(- tx, ty)。如果要将对象沿着一个方向移动，如沿着水平轴或者纵轴移动，可以使用translate( tx, 0) 和translate( 0, ty)来实现。其实在变形中还为单独一个方向移动对象提供了更简单的方法。 ·translateX()：水平方向移动一个对象。通过给定一个X轴方向的数值指定对象沿水平轴方向的位移。简单点

01

css的2D转换

下面通过css实现动画效果，可以使用脚本化的css实现滑入，轮廓伸缩的列表，即动态的HTML，一个过时的说法DHTML

00

Spring Data Mongo中@Transient无效的解决办法

项目使用MongoDB数据库，数据库框架用的是Spring Data Mongo，使用的过程中给字段加了@Transient注解防止字段被保存到数据库，发现不起作用。后来网上找资料发现了问题： Transient类

01

style="width: _" 与 width="_"

CSS width 和 height 属性可用于所有 HTML 元素。但 HTML width 和 height 属性仅适用于某些元素，如 canvas、img、table、td 等。

03

什么C3转换还可以这样玩？？？用CSS3实现2D转换、3D转换、3D呈现，详细总结及案例演示。

如下代码的效果为：当鼠标悬停在图片上时，图片会顺时针旋转360°，为了更具有动画效果，添加了过渡效果。

03

Linux基础之cd无法进入xargs管道输出的目录问题解决方法

今天在利用jenkins将项目部署到远程服务器，里面有个步骤涉及到切换目录，执行部署脚本的命令，原本思路是利用xargs和cd配合进行目录切换，执行的shell命令如下

02

解决pycharm中的run和debug失效无法点击运行

在多次跑项目中遇到情况，pacharm突然就无法运行项目了，表现就是run和debug两个选项按钮全部变灰色无法点击。

02

Mac中文版Ai矢量图设计软件:Illustrator 2022

Illustrator 2022 for Mac一款矢量图形软件，能够一次修改多个画板上的重复文本或对象来为您节省时间，帮助大家制作各类平面设计作品。Illustrator 2022 Mac中文版行业标准矢量图形软件来创建从华丽的 Web 和移动图形到徽标、图标、书籍插图、产品包装和广告牌的所有内容。

01

GDAL读取的坐标起点在像素左上角还是像素中心？

笔者在处理地理栅格数据的时候，总是会发生偏差半个像素的问题。比如说通过ArcMap打开一张.tif，查看其地理信息；同时用记事本打开.tfw，比较两者得地理信息：

02

使用Visual Studio 调试断点不起作用的问题解决办法调试Revit CAD 不能进入断点

随着Visual Studio 2010正式版的发布，相信不少人都像我一样升级到了Visual Studio 2010。那么您在使用VS2010在AutoCAD,Map 3D或Revit的.net应用程序开发时，多半也会遇到调试时断点总是不起作用的问题吧。Kean和Jeremy最近分别写了文章提到了几个解决办法，在这里给大家共享一下，原文请参考Hitting breakpoints in .NET Class Libraries while debugging with Visual Studio 2010

【CSS】CSS特效集锦，视觉魔法的碰撞与融合（一）

在本文中我讲述了7种CSS的特效，它们也许看起来并不惊艳，但是我认为却足够传达本文的理念：编写一些特殊的CSS样式的时候需要不拘于常理，要用特殊的认识角度看待标签和样式属性，从而用「绕个弯」的方式达到效果。

02

currentstyle 织梦_织梦channel标签currentstyle样式无效不起作用

我们在用织梦系统制作网站时，经常会用到channel标签来调子栏目。但是，很多朋友会遇到这种情况在使用channel标签来调子栏目的时候，指定 “type=son typeid=x” 发现currentstyle无效。今天笔者就跟大家分享一下解决方法。

01

键盘失灵，鼠标正常

2.准备尝试下软键盘是否起作用，结果在机器右下方任务管理器向上箭头处藏着2个特殊图标：1个是启用了筛选键，另1个是启用了鼠标键，有疑点；

01

Android自定义LinearLayout布局显示不完整的解决方法

原需求，在一个伸缩列表中，自定义LinearLayout继承LinearLayout动态添加布局。

01

evaluateJavascript_javascript alert报错

当前位置:我的异常网» Ajax » jquery.validationEngine 验证 AJAX 不起作用解决方

02

css3 transition原理(动画系列二）

CSS 过渡（transition）是通过定义元素从起点的状态和结束点的状态，在一定的时间区间内实现元素平滑地过渡或变化的一种补间动画机制。你可以让属性的改变过程持续一段时间，而不是立即生效。

02

小程序navigationBarBackgroundColor颜色显示问题

好长时间没有接触小程序了，感觉有点陌生，利用之前学的Vue根据mpVue框架重新熟悉一下小程序。

05

DotNetBar的使用—（界面风格）

C# WinForm项目中自带的窗体风格很普通，一点都不美观。DotNetBar就是一套.NET美化控件库，有70几个控件以及多种界面的皮肤风格。关于控件的效果在官网上进行查看http://www.devcomponents.com/dotnetbar/。下面就来介绍一下如何使用DotNetBar来改变窗体的风格。

02

解决Shiro注解无效的问题

当Shiro集成到Spring mvc中，却发现shiro的权限注解不起作用，官方的配置是要支持注解，只需要将以下代码加到spring 配置文件中即可：

02

spring声明事务失效问题

在项目开发中遇到了一个spring事务失效的问题，检查配置文档，都没有问题，其他的类中的方法都能进行事务管理，而这个类中的方法却不行。

05

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭