rotate()旋转:旋转rotate(-30deg)函数通过指定的角度参数使元素相对原点进行旋转。它主要在二维空间内进行操作,设置一个角度值,用来指定旋转的幅度。

如果这个值为正值,元素相对原点中心顺时针旋转

如果这个值为负值,元素相对原点中心逆时针旋转

用法:transform:rotate(-30deg);

效果

CSS3 变形--旋转 rotate()

关于加上浏览器的前缀:

transform:rotate(-30deg);

     -webkit-transform:rotate(-30deg);

     -moz-transform:rotate(-30deg);

     -o-transform:rotate(-30deg);

     -mz-transform:rotate(-30deg);

为什么要加前缀 ?

     css标准中各个属性都要经历从草案到定稿的过程,css3中的属性进展都不一样。浏览器厂商在标准尚未明确情况下提前支持会有风险,而且各个浏览器对CSS3的支持也不同,所以每种浏览器使用了自己的私有前缀与标准进行区分,当标准确立后,各大浏览器将逐步支持不带前缀的css3新属性。

目前已有很多私有前缀可以不写了,但为了兼容老版本的浏览器,可以仍沿用私有前缀和标准方法,逐渐过渡。

前缀          浏览器

         -webkit           chrome和safari

         -moz            firefox

         -mz             IE

         -o               opera

         注意:IE9版本以下不支持,所以就算加上前缀也是没用的。Safari,是苹果计算机的最新操作系统Mac OS X中的浏览器。

Opera浏览器,是一款挪威Opera Software ASA公司制作的支持多页面标签式浏览的网络浏览器,是跨平台浏览器可以在WindowsMacLinux三个操作系统平台上运行。

相关文章:

  • 2021-08-15
  • 2021-11-23
  • 2021-09-23
  • 2021-12-11
  • 2022-01-31
  • 2021-06-17
  • 2022-03-03
  • 2021-09-01
猜你喜欢
  • 2021-06-29
  • 2022-02-08
  • 2022-01-04
  • 2022-02-08
  • 2021-12-05
  • 2022-03-06
  • 2022-01-16
相关资源
相似解决方案